this.setData({})用于将数据从逻辑层发送到视图层（异步），同时改变对应的 this.data 的值（同步）。用this.data而不用this.setData({})会造成页面内容不更新的问题。
例如下面的代码addPerson:函数中，如果写成this.data.name = '保存'，那么点击'新增参保人'，按钮的名称是不会更改成"保存"的。因为微信框架里面说了用this.data的形式，数据会变，但是视图并不会变。也就是说，其实'新增参保人'已经变成了'保存'，只是视图没更新而已。用this.setData({})的形式不仅会改变数据，而且还会改变视图。
还有非常重要的一点，如果页面需要显示动态的数据的话,那么我们必须要把数据更新到data中对应的变量中。例1：更新array数组中第0个元素msg这个key对应的value。``例2：更新name的值。 msg和name都在data中，都是变量。

全部代码如下

index.js

Page({
  data: {
    text: 'init data',
    array: [{ msg: '马大哈，大马哈' }, { msg: '风格迥异' }],
    name: '新增参保人',// name的默认值
  },
  addPerson:function(event){
    // this.data.name = '保存'
    this.setData({
      name:'保存'
    })
  },
  modifyArray:function(event){
    this.setData({
      'array[0].msg':'新值'
    })
  }

})

index.wxml

<view class='topText'>{{text}}</view>
<view class='midText' bindtap="modifyArray">{{array[0].msg}}</view>
<view class='footerBtn' bindtap="addPerson">{{name}}</view>

index.wxss

.topText{
  position: fixed;
  top: 50rpx;
  left: 0;
  width: 100%;
  height: 300rpx;
  background: #e91010;
  color: #fff;
  font-size: 60rpx;
  display: flex;
  align-items: center;
  justify-content: center;
}


.midText{
  position: fixed;
  top: 500rpx;
  left: 0;
  width: 100%;
  height: 80rpx;
  background: #10e934;
  color: rgb(0, 0, 0);
  font-size: 20rpx;
  display: flex;
  align-items: center;
  justify-content: center;
}

.footerBtn {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 110rpx;
  background: #108ee9;
  color: #fff;
  font-size: 32rpx;
  display: flex;
  align-items: center;
  justify-content: center;
}

默认状态

image.png

点击底部'新增参保人'按钮之后，按钮名称变为“保存”

image.png

点击'马大哈，大马哈'按钮之后，按钮名称变为“新值”

image.png