微信小程序開發中類似vue的v-model綁定功能

  

在 WXML 中，普通的屬性的綁定是單向的。例如：

<input value="{{value}}" />

如果需要在用戶輸入的同時改變 this.data.value ，需要借助簡易雙向綁定機制。此時，可以在對應項目之前加入 model: 前綴：

<input model:value="{{value}}" />

用於雙向綁定的表達式有如下限制：

1.只能是一個單一字段的綁定，如

<input model:value="值為 {{value}}" />
<input model:value="{{ a + b }}" />

2.不能 data 路徑

<input model:value="{{ a.b }}" />

 

組件中也支持簡易綁定

// custom-component.js
Component({
  properties: {
    myValue: String
  }
})

<!-- custom-component.wxml -->
<input model:value="{{myValue}}" />

使用組件
<custom-component model:my-value="{{pageValue}}" />

詳情見： https://developers.weixin.qq.com/miniprogram/dev/framework/view/two-way-bindings.html