问题描述:
在开发过程中数据经常以对象方式组织,对页面修改数据进行保存时使用this.data.obj无法获取修改后数据。
官方文档解释 简易双向绑定
1.只能是一个单一字段的绑定
<input value="{{value}}" />
2.目前,尚不能 data 路径,如
<input model:value="{{ a.b }}" />
这通常不满足我们日常开发需要
解决办法
通过在input框中设置name属性,
然后在函数中使用e.detail.value获取form数据
<form catchsubmit="saveChangeHouse"><view><input hidden="true" name="id" value="{{house.ID}}"/><t-input type="text" name="xmmc" value="{{house.xmmc}}" label="项目名称" placeholder="请输入项目名称" ></t-input><t-input type="number" name="mj" value="{{house.mj}}" label="面积(㎡)" placeholder="请输入房屋面积" ></t-input><t-input type="text" name="hx" value="{{house.hx}}" label="户 型" placeholder="请选择户型" ></t-input><t-input type="text" name="cx" value="{{house.cx}}" label="朝 向" placeholder="请选择朝向" ></t-input><t-textarea label="说 明" name="sm" placeholder="请填写说明" value="{{house.sm}}"></t-textarea></view><view><t-button type="submit" data-method="save"theme="light" size="large" style="width: 100%;margin-top: 10px;" >暂存</t-button></view></form>
Page({/*** 页面的初始数据*/data: {house:{},},saveChangeHouse(e){let method = e.detail.target.dataset.method;let data= {house:e.detail.value,method:method}
})
PS:
网上其他博主使用 model:value绑定,对于data.路径亲测无效
<t-input type="number" model:value="{{house.mj}}" label="面积(㎡)" placeholder="请输入房屋面积" ></t-input>
欢迎大家交流探讨