自定义一个全局指令
定义了一个获得焦点的指令(没有值的属性)
Vue.directive('focus', {
inserted: function(el) {
// el表示指令锁绑定的元素
el.focus();
}
});
使用该指令
<input type="text" v-focus>
定义了一个改变文本框颜色的指令(有值的属性)
Vue.directive('color', {
bind: function(el, binding) {
// el表示指令锁绑定的元素
el.style.backgroundColor = binding.value.color;
}
});
binding.value是属性的值
使用该指令
data: {
msg: {
color: 'orange',
}
}
<input type="text" v-color='msg'>