请教高手解决思路。本人用WX:FOR循环生成了了以下界面的问卷，从上到下共三层。这个倒不是很重要。每个问题，如1.1， 1.2, 1.3 都是含有四个图片说明按钮，用来增加图片，用wx:if="{{item.picshow}}" 一次性控制每个问题的4个图片是否显示。某种程度上，其实每个 图片说明+ 都是唯一的，都需要追溯未来值(src)的。我的问题是，
- 在我现有JS wxml 架构下，是否可以实现bindtap锁定每个图片说明组件？ 主要是不知道id data-id怎么巧妙使用。
- 或者需要转换何种架构更好的实现我的逻辑，或者如何能给每个图片说明加个唯一id ？ 咋实现？
- 下一步，接收每个问题的所有控件的值，还是使用数组为最佳选择？
谢谢。
未操作时截图：
操
作了第一个图片时的截图：可以看到第一列的都进行了图片显示。
WXML：
<view wx:if="{{isShowOutL3_1}}">
<scroll-view scroll-y="true" style="height:1080rpx">
<view class="L3box" wx:for="{{outlistL3_1}}" wx:key="id">
<view class="quesStyle">{{item.question}}view>
<radio-group id="{{item.id}}" class="radiostyle" wx:if="{{item.radioshow}}" bindchange="handlechange">
<radio value="yes" checked="true" class="yesstyle">是radio>
<radio value="no" class="nostyle">否radio>
radio-group>
<textarea id="{{item.id}}" wx:if="{{item.freecommshow}}" maxlength='160' placeholder='有格式要求的请按照格式要求输入，最多160个字' class="txtstyle" bindinput="handleipt">textarea>
<view class="picarea" wx:if="{{item.picshow}}">
<view wx:if="{{isActivePic1}}" data-pic1="{{item.id}}" data-id="1" class="addpic" bindtap="uploadpic1">图片说明+view>
<image src="{{src_pic1}}" id="{{item.id}}" bindtap="previewpic1" class="addpic" wx:if="{{isShow_pic1}}">image>
<view wx:if="{{isActivePic2}}" data-pic2="{{item.id}}" data-id="2" class="addpic" bindtap="uploadpic2">图片说明+view>
<image src="{{src_pic2}}" id="{{item.id}}" bindtap="previewpic2" class="addpic" wx:if="{{isShow_pic2}}">image>
<view wx:if="{{isActivePic3}}" data-pic3="{{item.id}}" data-id="3" class="addpic" bindtap="uploadpic3">图片说明+view>
<image src="{{src_pic3}}" id="{{item.id}}" bindtap="previewpic3" class="addpic" wx:if="{{isShow_pic3}}">image>
<view wx:if="{{isActivePic4}}" data-pic4="{{item.id}}" data-id="4" class="addpic" bindtap="uploadpic4">图片说明+view>
<image src="{{src_pic4}}" id="{{item.id}}" bindtap="previewpic4" class="addpic" wx:if="{{isShow_pic4}}">image>
view>
JS节选：
uploadpic1(res) {
console.log("res", res)
let that = this
wx.chooseImage({
count: 1,
sizeType: ['compressed'],
sourceType: ['album', 'camera'],
success(res) {
// tempFilePath可以作为img标签的src属性显示图片
const tempFilePaths = res.tempFilePaths[0]
// console.log("选择图片成功", res.tempFilePaths[0])
let randString = Math.floor(Math.random() * 1000000).toString() + '.png'
wx.cloud.uploadFile({
cloudPath: randString,
filePath: tempFilePaths, // 文件路径
success: res => {
// get resource ID
// console.log(res.fileID)
that.setData({
src_pic1: res.fileID,
isShow_pic1: true,
isActivePic1:false,
})
},
fail: err => {
// handle error
uploadpic2(res) 类同上面 uploadpic3(res) 类同上面 uploadpic4(res)类同上面
Data中数组定义;
outlistL3_1: [
{
id: "Out.1.1",
question: "1.1 是否有箱唛? ",
radioshow: true,
formatcommshow: false,
formatcontent: ["Yes", "No", "描述一", "描述二"],
freecommshow: false,
picshow: true
},
{
id: "Out.1.2",
question: "1.2 主/正唛是否符合标准? ",
radioshow: true,
formatcommshow: false,
formatcontent: ["Yes", "No", "描述一", "描述二"],
freecommshow: false,
picshow: true
},
{
id: "Out.1.3",
question: "1.3 有无手写唛? ",
radioshow: true,
formatcommshow: false,
formatcontent: ["Yes", "No", "描述一", "描述二"],
freecommshow: true,
picshow: true
},
list:[ { name:'1.1', banner:[ { img:'1.1下第一张', isTrue:false }, { img:'1.1下第二张', isTrue:false }, ] }, { name:'1.2', banner:[ { img:'1.2下第一张', isTrue:false }, { img:'1.2下第二张', isTrue:false }, ] } ]数据格式改成这种吧，点击某张图的时候， 传父子id或者index，可以精确定位
outlistL3_1: [
{
id: "Out.1.1",
question: "1.1 是否有箱唛? ",
radioshow: true,
formatcommshow: false,
formatcontent: ["Yes", "No", "描述一", "描述二"],
freecommshow: false,
pics: [{url: '路径', show: false},{url: '路径', show: false},{url: '路径', show: false},{url: '路径', show: false}]
},
改一下数据结构