当前位置: 首页 > 工具软件 > Paths.js > 使用案例 >

数据双向绑定Two-way binding does not support complex data paths currently. This two-way binding is ignored

骆雅昶
2023-12-01

项目场景:

后端返回数据,小程序用wx:for循环数据,实现双向绑定提示报Two-way binding does not support complex data paths currently. This two-way binding is ignored


问题描述

model:value不能实现双向绑定,

wxml:

<view>
  <view  wx:for="{{listData}}"  wx:key="true" wx:for-index="i">
    <view>
      <view>时间:</view>
      <input type="text" model:value="{{item.applyTime}}" data-id="{{i}}" placeholder="请输入时间" />
    </view>
    <view>
      <view>机构:</view> 
      <input type="text" model:value="{{item.detectionCompany}}" data-id="{{i}}" placeholder="请输入机构" />
    </view>
  </view>
</view>

解决方案:

添加bindinput方法,实现双向绑定

wxml:

<view>
  <view  wx:for="{{listData}}"  wx:key="true" wx:for-index="i">
    <view>
      <view>时间:</view>
      <input type="text" model:value="{{item.applyTime}}" data-id="{{i}}" placeholder="请输入时间" bindinput="inputApplyTime"/>
    </view>
    <view>
      <view>机构:</view> 
      <input type="text" model:value="{{item.detectionCompany}}" data-id="{{i}}" placeholder="请输入机构" bindinput="inputDetectionCompany"/>
    </view>
  </view>
</view>

js:

 data: {
    listData:[],
}
 //双向绑定数据
  inputApplyTime:function(e){
    var applyTime = e.detail.value
    var i = e.currentTarget.dataset.id
    this.data.listData[i].applyTime = applyTime
    this.setData({
      listData: this.data.listData
    })
  },
  inputDetectionCompany:function(e){
    var detectionCompany = e.detail.value
    var i = e.currentTarget.dataset.id
    this.data.listData[i].detectionCompany = detectionCompany
    this.setData({
      listData: this.data.listData
    })
  },

 类似资料: