web前端vue：可以使用javascript的表示式解析

學了怎麼久的vue到現在為止在我們的模板元件中，我們一直都只繫結簡單的屬性鍵值。但實際上，對於所有的資料繫結，Vue.js 都提供了完全的 JavaScript 表示式支援，如下程式碼例項：

<div>{{number + 2}} </div> // 一個簡單的加計算
<div>{{OK?'顯示':'不顯示'}} </div>  // 三元計算
<div>{{ qihui.split('').reverse().join('') }}
</div> // 或對更復雜的對陣列或物件刪除新增操作

上面這些例項只能在當前元件的作用域內才有效，然後被JavaScript 解析，然而它這裡還有個限制：就是每個繫結都只能包含單個表示式，所以下面的例子都是不會生效的。

<div>{{ let q = 2 }}</div>  //這個不是表示式
<div>{{if(ok){return '顯示'}}}</div> //流控制也不會生效，請使用三元表示式

下面再為大家舉三個很常用的例子：

<div>{{val? val: '0'}}</div> // 簡單的三元表示式，這裡兩次都提到了，所以是重點
<div>{{val / 60}}</div>  // 簡單的數學算數運算，當然‘加減乘除’都可以
<div>{{(val / 60) * 10 - 10+20}}</div> // 或者更復雜的算數運算
<div>{{Function('傳值')}}</div>  //這是一個方法的呼叫
methods:{  // 方法
  Function(val){
    return val
  }
}

有不懂的朋友或喜歡前端的同學可以加我微信（nihaomeili87）我們一起進步！等你噢～