前言:

首先，小程序没有自带的双向绑定。

正文里是模拟效果，原理是。

步骤：

（1）主要是使用input的两个方法：bindinput="syncInputValue" bindblur="setInputValue"。

-- 实际上只用bindinput就可以，不过为了减少setDate方法的调用，就把setDate放进bindblur里了。

（2）然后把变量名，通过dataSet传进方法：

wxml: data-field-name="city"

js: let fieldName = e.target.dataset.fieldName;

（3）最后引用变量

this.setData({

[`${fieldName}`]: value

})

代码

wxml

<!--index.wxml-->
<view class="container">
  <view style="display:flex;">
    <view>地市：</view>
    <view>
      <input type=text value="{
         
  { city }}"  data-is-obj="0" data-obj-name="" data-field-name="city" bindinput="syncInputValue" bindblur="setInputValue" />
    </view>
  </view>
  <view style="display:flex;">
    <view>姓名：</view>
    <view>
      <input type=text value="{
         
  { user.name }}"  data-is-obj="1" data-obj-name="user" data-field-name="name" bindinput="syncInputValue" bindblur="setInputValue" />
    </view>
  </view>

  <view style="margin-top:100rpx;">
    {
         
  {city + "： " +  user.name}}
  </view>

</view>

js

//index.js
//获取应用实例
const app = getApp()

Page({
  data: {
    city:"泉州",
    user:{
      name:"a1"
    },
  },
  onLoad: function () {
  },

  syncInputValue: function(e){
    // console.log("输入：" + e.detail.value)
    this._tempInputValue = e.detail.value;
  },
  setInputValue: function(e){
    let value = this._tempInputValue;
    // console.log("写入：" + value)
    if(!value) {return;}
    let isObj = e.target.dataset.isObj;
    let objName = e.target.dataset.objName;
    let fieldName = e.target.dataset.fieldName;
    if(isObj=="1"){
      let obj = this.data[`${objName}`];
      obj[fieldName] = this._tempInputValue;
      this.setData({
        [`${objName}`]: obj
      });
    }else{
      this.setData({
        [`${fieldName}`]: value
      })
    }
    this._tempInputValue = null;
  },
})

--要离开输入框才会赋值