代码如下，赋值后，调试输出数据已经改变，但是页面表单始终不显示，已尝试使用以下三种方法，均无作用。

// JS
  */
  data: {
    // 表单数据
    formData: {
      shop_name:''
    },
    rules: [{
      name: 'shop_name',
      rules: [{
        required: true,
        message: '店铺名称必填'
      }, {
        minlength: 4,
        message: '店铺名称最短为4个字符'
      }, {
        maxlength: 35,
        message: '店铺名称最长为35个字符'
      }]
    }]
  },
  readInfo() {
    var that = this
    // 调用云函数
    wx.cloud.callFunction({
      name: 'getxxx',
      data: {},
      success: res => {
        console.log('getxxx: ', JSON.stringify(res))
        if (res) {
          let str = "formData.shop_name";
          // 第一种
          that.data.formData.shop_name = res.result.shop_name;
          // 第二种
          that.setData({
            [`formData.shop_name`]: res.result.shop_name
          })
          // 第三种
          that.setData(
            {
              formData:{
                  shop_name: res.result.shop_name
              }
            })
        }
      },
      fail: err => {
        
      }
    })
  }

 // 页面结构如下
  <mp-form id="form" rules="{{rules}}" models="{{formData}}">
      <mp-cell show-error prop="shop_name">
        <input bindinput="formInputChange" minlength="4" maxlength="35" data-field="shop_name" class="weui-input"/>
      </mp-cell>
  </mp-form>

// 确认相关组件已导入
    "usingComponents": {
      "mp-toptips": "../components/toptips/toptips",
    "mp-cells": "../components/cells/cells",
    "mp-cell": "../components/cell/cell",
    "mp-form": "../components/form/form"
  }