关于 setData 的一个问题
发布于 5 年前 作者 tao69 17719 次浏览 来自 问答

如图。

如果我在代码中写

Page({
  data: {
    text: 'init data',
    array: [{text: 'init data'}],
    object: {
      text: 'init data'
    }
  }
})

如果调用

this.setData({
   'array[0].text':'changed data'
})

按照文档所说，此时， this.data.array[0].text 应该会变成 changed data 。

如果我调用

this.setData({
   'arr[0].text':'changed data',
})

按照文档所说，此时， this.data.arr[0].text 应该会变成 changed data 。

那如果，我需要 this.data['arr[0].text '] 赋值，应该如何处理？

又或者，这样调用

this.setData({
   'array[0].text':'changed data',
   'text':'changed text'
})

这时候，又应该如何进行呢？

选项一：this.data.text === ‘changed text’， this.data.array[0].text === ‘changed data’

选项二：this.data.text === ‘changed text‘， this.data[‘array[0].text’] === ‘changed data’


（通过实际代码运行结果，是选项一为答案）


参考 lodash 的做法，是 _.set(obj, path, value) ，确定了一定是切割 path 进行数据创建的，但是只局限于一次进行一个 path 的设置。

疑惑就是这个，希望能解答。

最好就是能把内部实现的 setData 代码贴出来，方便查阅。

2 回复
 obj: {
      text: 'init data'
    }

你这个又怎么赋值呢？？

写了个测试代码。

Page({
  data: {
    text: 'init data',
    array: [{falg: false, text: 'init data'}],
    obj: {
      text: 'init data'
    }
  },
 
  setData1 () {
    this.setData({
      'array[0].text':'changed data 1',
    })
    console.log(this.data);
  },
 
  setData2 () {
    this.setData({
      'arr[0].text':'changed data 2',
    })
    console.log(this.data);
  },
 
  setData3 () {
    this.setData({
       'array[0].text':'changed data 3',
       'arr[0].text':'changed data',
       'arr[1].text':'changed data',
       'arr[2]-text':'changed data',
       '_arr[2]-text':'changed data',
       'text':'changed text',
    })
    console.log(this.data);
  },
 
  setData4 () {
    this.setData({
       array: [{
        text: 'changed data 4',
       }],
       'arr[0].text':'changed data',
       'arr[1].text':'changed data',
       'arr[2]-text':'changed data',
       '_arr[2-text':'changed data',
       'text':'changed text',
    })
    console.log(this.data);
  },
 
  setData5 () {
    this.setData({
       array: [{
        text: 'changed data 5',
       }]
    })
    console.log(this.data);
  },
})
<view class="index">
  <view class="index-desc">setData 测试</view>
  <button type="default" bindtap="setData1">setData1</button>
  <button type="default" bindtap="setData2">setData2</button>
  <button type="default" bindtap="setData3">setData3</button>
  <button type="default" bindtap="setData4">setData4</button>
  <button type="default" bindtap="setData5">setData5</button>
</view>
回到顶部