Vue.js 教程
除了默認(rèn)設(shè)置的核心指令( v-model 和 v-show ), Vue 也允許注冊(cè)自定義指令。
下面我們注冊(cè)一個(gè)全局指令 v-focus, 該指令的功能是在頁(yè)面加載時(shí)，元素獲得焦點(diǎn)：
我們也可以在實(shí)例使用 directives 選項(xiàng)來(lái)注冊(cè)局部指令，這樣指令只能在這個(gè)實(shí)例中使用：
指令定義函數(shù)提供了幾個(gè)鉤子函數(shù)（可選）：
bind: 只調(diào)用一次，指令第一次綁定到元素時(shí)調(diào)用，用這個(gè)鉤子函數(shù)可以定義一個(gè)在綁定時(shí)執(zhí)行一次的初始化動(dòng)作。
inserted: 被綁定元素插入父節(jié)點(diǎn)時(shí)調(diào)用（父節(jié)點(diǎn)存在即可調(diào)用，不必存在于 document 中）。
update: 被綁定元素所在的模板更新時(shí)調(diào)用，而不論綁定值是否變化。通過(guò)比較更新前后的綁定值，可以忽略不必要的模板更新（詳細(xì)的鉤子函數(shù)參數(shù)見(jiàn)下）。
componentUpdated: 被綁定元素所在模板完成一次更新周期時(shí)調(diào)用。
unbind: 只調(diào)用一次， 指令與元素解綁時(shí)調(diào)用。
鉤子函數(shù)的參數(shù)有：
v- 前綴。v-my-directive="1 + 1", value 的值是 2。update 和 componentUpdated 鉤子中可用。無(wú)論值是否改變都可用。v-my-directive="1 + 1" ， expression 的值是 "1 + 1"。v-my-directive:foo， arg 的值是 "foo"。v-my-directive.foo.bar, 修飾符對(duì)象 modifiers 的值是 { foo: true, bar: true }。update 和 componentUpdated 鉤子中可用。以下實(shí)例演示了這些參數(shù)的使用：
有時(shí)候我們不需要其他鉤子函數(shù)，我們可以簡(jiǎn)寫(xiě)函數(shù)，如下格式：
Vue.directive('json', function (el, binding) {
// 設(shè)置指令的背景顏色
el.style.backgroundColor = binding.value.color
})
指令函數(shù)可接受所有合法的 JavaScript 表達(dá)式，以下實(shí)例傳入了 JavaScript 對(duì)象：