<span>Text: {{text}}</span> ?//當text的值發(fā)生改變時，文本中的值聯(lián)動也發(fā)生變化。

如果只需渲染一次數據，可以通過<span>Text: {{*text}}</span>或者<span v-once>這個將不會改變：{{text}}</span>

如果值是HTML片段，可以使用三個大括號綁定

<div>Logo: {{{logo}}} </div>

logo:'<span>daa</span>

或

<p>{{rawHtml}}</p> ? <p>using v-html :<span v-html="rawHtml"></span></p>

v-if: 生成或者移除一個元素

<template v-if="ok"> ? ? ?//v-if="variable==xx"

? ? <h1>Title</h1>

? ? <p>Paragraph 1</p>

</template>

v-show:顯示或者隱藏HTML元素，不支持<template>語法

v-if有更高的切換消耗，v-show有更高的初始渲染消耗,需要頻繁切換用v-show

v-model：表單控件元素上創(chuàng)建雙向數據綁定。自動選取正確的方法更新元素，在v-model指令后面還可以添加多個參數（number、lazy、debounce）

如果將用戶輸入轉換為NUmber類型，如果原值轉換結果為NaN，則返回原值

加上lazy，將數據改到change事件中發(fā)生

debounce設置最小的延時，<input v-model="msg" debounce="5000"><br/>{{msg}}內容在5000ms后才改變

v-for:?

可以用$index來獲取索引, ?如果遍歷為字典，每個對象都有一個特殊屬性$key

如：<li v-for= "item in items" class="item-{{$index}}"> ?//$index = 0、1、2...

從目標數組中找到并刪除元素：demo.items.$remove(item)

字典相關方法：$add(key, value) ?$set(key, value) $delete(key)

同時還可以和內置過濾器或排序數據一起使用

'<li v-for = "user in users | filterBy searchText in 'name'">{{user.name}}</li>' ?//根據input輸入框輸入的searchText，過濾users中的name

'<li v-for="user in users | orderBy field reverse">{{user.name}}</li>' ?//給數組根據field變量代表的tag字段根據reverse選擇是正序還是反序(-1)

v-text

更新元素的textcontent

<span v-text="msg"></span> ?相當于 <span>{{msg}}</span>

v-bind

將一個或多個attribute，或者一個組件prop動態(tài)綁定到表達式。v-bind可以簡寫

<img v-bind:src="imageSrc"> ?縮寫：<img :src="imageSrc">

v-bind:href ?= :href ? ? v-on:click = @click