2023年微信小程序 简易双向绑定
作者: --时间: 2025-06-27 21:26:45
阅读量：
微信小程序 简易双向绑定
微信小程序是一种非常流行的快速开发应用程序的工具，而简易双向绑定是其中一个非常有用的功能。通过它，我们可以实现页面上数据的双向绑定，在用户修改页面上的数据时，可以自动更新数据模型，从而避免手动操作。
1. 双向绑定语法
在 WXML 中，普通的属性的绑定是单向的。如果要在用户输入时同时改变数据模型，需要借助简易双向绑定机制。此时，可以在对应项目之前加入 model: 前缀。
用于双向绑定的表达式有如下限制：
- 只能是一个单一字段的绑定；如<input model:value="值为 {{value}}" />和<input model:value="{{ a + b }}" />都是非法的；
- 目前，尚不能使用 data 路径，如<input model:value="{{ a.b }}" />这样的表达式目前暂不支持。
2. 在自定义组件中传递双向绑定
双向绑定同样可以使用在自定义组件上。自定义组件可以将自身的 属性 双向绑定到组件内部的元素属性上。这样，当组件内部元素属性的值更改时，自定义组件的属性也会相应地进行更新。
3. 在自定义组件中触发双向绑定更新
自定义组件还可以自己触发双向绑定更新。做法就是：使用 setData 设置自身的属性。如果页面中使用了该组件，并且指定了一个数据对象作为其属性值，在组件内部调用 setData 更新属性之后，页面对应路径的数据也会发生变化，从而使得页面渲染发生改变。
上一篇：2023年微信小程序 基础组件
下一篇：2023年微信小程序 性能Trace工具
