小程序 修改数组字段

wxml模块代码:
<!--pages/registerInfo/registerInfo.wxml-->
<view class='contain'>
<view class='main'>

<view class='question' wx:for='{{multiform}}' wx:key='{{index}}'  wx:for-item='multi' wx:for-index='current'>
  <view class='label' wx:for='{{multiform[current]}}' wx:key='{{index}}' wx:for-index='present'>
    <view class='title'>
      <text style='color:#f00' wx:if='{{item.isNeed}}'>*</text>
      {{item.name}}
    </view>
    <view class='detail' wx:if='{{item.type==1}}'>
      <input data-present='{{present}}' data-current='{{current}}' bindinput='getVal' placeholder='{{item.tips}}' placeholder-class="phcolor"></input>
    </view>
    <view class='detail' wx:else>
      <picker bindchange="bindPickerChange" data-current='{{current}}' data-present='{{present}}' value="{{item.current}}" range="{{item.optionsList}}">
        <view class="picker">
          <text class='phcolor'>{{item.optionsList[item.current]}}</text>
        </view>
      </picker>
    </view>
  </view>
</view>

</view>
<view class='footer'>

<button bindtap='nextStep'>下一步</button>

</view>
</view>

js代码:
const app = getApp()

Page({

/**

  • 页面的初始数据

*/
data: {

activityId:null,
number:1,//默认一人报名
multiform:[],
form:[]

},

/**

  • 生命周期函数--监听页面加载

*/
onLoad: function (options) {

console.log(options)
this.setData({
  activityId:options.activityId,
  number:options.number
})
this.getQuestions()

},
// 获取问题列表
getQuestions:function(){

const that=this
wx.showLoading({
  title: '加载中',
  mask: true
});
wx.request({
  url: app.globalData.baseUrl + '/Application/appPost?action=Activity/getActivityQuestions.do',
  header: app.globalData.header,
  method: 'post',
  data: {
    "activityId": that.data.activityId,
    "http_headers": app.globalData.http_headers
  },
  dataType: 'json',
  success:(data)=>{
    console.log(data)
    if(data.data.result=='success'){
      let multiform = []
      for (let j = 0; j < data.data.signUpQuestionList.length;j++){
        if (data.data.signUpQuestionList[j].type==2){
          let optionsList=[]
          for (let k = 0; k < data.data.signUpQuestionList[j].options.length;k++){
            optionsList.push(data.data.signUpQuestionList[j].options[k].value)
          }
          data.data.signUpQuestionList[j].optionsList = optionsList
          data.data.signUpQuestionList[j].current=0
        }
        else{
          data.data.signUpQuestionList[j].val=''
        }
      }
      for (let i = 0; i < that.data.number; i++) {
        const signList=data.data.signUpQuestionList
        multiform.push(signList)
      }
      that.setData({
        form:data.data.signUpQuestionList,
        multiform: multiform
      }) 
    }
    else{
      wx.showToast({
        title: data.data.text,
        icon: 'none',
        duration: 2000
      })
    }
  },
  complete:()=>{
    wx.hideLoading()
  }
})

},

//获取input值
getVal:function(e){

let that=this
const present = e.currentTarget.dataset.present
const current = e.currentTarget.dataset.current
const val=e.detail.value
let resetForm = [].concat(that.data.multiform)
resetForm[current][present].val=val
console.log('当前条current:'+current+';当前present:'+present)
that.setData({
  multiform: resetForm
})

},

// 获取下拉框值
bindPickerChange:function(e){

const that=this
console.log('picker发送选择改变,携带值为', e.detail.value)
let multiform = that.data.multiform
const index = e.currentTarget.dataset.current
const present = e.currentTarget.dataset.present
console.log('index:'+index+';present:'+present)
multiform[index][present].current=e.detail.value
console.log(multiform[index][present])
this.setData({
  multiform: multiform
})

},

nextStep:function(){

const formList=this.data.multiform
for(let i=0;i<formList.length;i++){
  for(let j=0;j<formList[i].length;j++){
    const list=formList[i][j]
    console.log(list)
    if (list.isNeed){
      console.log(list.isNeed)
      if(list.type==1 && list.val==''){
        wx.showToast({
          title: '请完善报名信息',
          icon: 'none',
          duration: 2000
        })
        return
      }
    }
  }
}
// return
wx.setStorage({
  key: 'regInfo',
  data: this.data.multiform,
})
wx.navigateTo({
  url: '../confirm/confirm?activityId='+this.data.activityId,
})

},

})

问题描述: form为需要填写的字段,而number为报名的人数,通过遍历number数量将form push到multiform生产对应的需要报名人数的数组,例如

clipboard.png
当前是两个用户需要填写的内容。

问题:现在存在的问题是bindinput和bindchange绑定的事件都将两个用户的字段填充了?

阅读 3.6k
1 个回答

发现了,将数据写死在data里面是可以单独渲染选中字段的,但是动态渲染的话就不行...有知道怎么解决的么

更新于18.7.12
无关乎小程序问题,脑子一时懵了
其实就是对象的没有进行深度赋值,只是单纯的把新对象的地址指向了旧对象,所以新对象属性修改才会改变旧对象的属性。所以想单纯的进行复制的话可以直接将对象类型转换再转换:parse.JSON(JSON.stringify(xx))。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题