數據綁定有一部分前幾個看著還行，后面的幾個可能有幾個不理解，界面展示的數據有的也因為條件沒法顯示。看不懂的可以先記著，后面真正用到時就會明白，反正我是這樣想的。這里先記錄下

data.wxml

<!--數據綁定使用對象---內容-->
<view>{{message}}</view>

<!--數據綁定使用對象---組件屬性---需要在雙引號之內-->
<view id="item-{{id}}">組件屬性</view>

<!--數據綁定使用對象---控制屬性---需要在雙引號之內-->
<view wx:if="{{condition}}">控制屬性</view>

<!--數據綁定使用對象---三元運算-->
<view hindden="{{flag ? true : false}}">三元運算符</view>

<!--數據綁定使用對象---算數運算-->
<view>我是運算結果---{{a + b}} + {{c}} + d</view>

<!--數據綁定使用對象---邏輯判斷-->
<view wx:if="{{length > 5}}">asdf</view>

<!--數據綁定使用對象---字符串運算-->
<view>{{"Hello " + name}}</view>

<!--數據綁定使用對象---數組組合-->
<view wx:for="{{[zero, 1, 2, 3, 4, 5, 6]}}">{{item}}</view>

<!--數據綁定使用對象---對象-->
<template is="objectCombine" data="{{for: x, bar: y}}"></template>

<!--數據綁定使用對象---擴展運算符對象 ... 將一個對象展開-->
<template is="objectCombine" data="{{...obj1, ...obj2, p: 5}}"></template>

<!--數據綁定使用對象---對象的key和value相同時-->
<template is="objectCombine" data="{{foo, bar}}"></template>

data.js

Page({
 data:{

 //內容綁定
 message: 'Hello WeApp',

 //組件屬性綁定
 id: 0,

 //控制屬性綁定
 condition: true,

 //三元運算
 flag:false,

 //算數運算
 a: 1,
 b: 2,
 c: 3,

 //邏輯判斷
 length: 6,

 //字符串運算
 name: '順子',

 //數組組合
 zero: 0,

 //對象

 x: 0,
 y: 1,

 //對象展開
 obj1: {
  a: 1,
  b: 2
 },
 obj2: {
  c: 3,
  d: 4
 },
 p: 5,

 //對象key和value形同時
 foo: 'my-foo',
 bar: 'my-bar'



 },
})

以上就是深入了解微信小程序數據綁定的詳細內容，更多請關注php中文網其它相關文章！