Small micro-channel programs - pages dynamically modify data and parameter passing

Dynamically modify page data

In the applet we often have to render dynamic data, for starters, we often encounter the modified data display and page shows inconsistencies in the console, because we use the "=" modify data, which can be modified, but can not change the state of the page, it will result in data inconsistency, the code is as follows:

data: {
    array: [{ text: '数组' }]
  }

onLoad:function(){
　　this.data.array[0].text=1;
　　console.log(this.data.array[0].text);
}

 

Modify the code:

onLoad:function(){
    // this.data.array[0].text=1;
    this.setData({
      'array[0].text': '1'
    })
    console.log(this.data.array[0].text);
  }

 

 

Summary: There are two ways to modify data of the data

1, the direct use of "=" assignment, which can be modified, but can not change the state of the page, it will result in data inconsistency .

2, this.setData, setData the function for transmitting data from the logical layer to the view layer (asynchronous), while corresponding to the change  this.data value (synchronization).