注册自定义标签有两种形式:全局注册、局域注册
全局注册可以在任意地方使用,局域注册只能在Vue实例作用域范围内使用
全局注册标签 - 标签前缀 v- 会自动添加到定义的名字前
作用:自动把小写的英文变成大写
Vue.directive('upper', {
// el 表示引用标签的dom元素,binding指向标签
inserted: function(el, binding) {
el.innerHTML = binding.value.toUpperCase();
}
})
new Vue({
el: '#app',
data: {
msg: 'abcedf'
}
})
<p v-upper="msg"></p>
局域注册标签
在vue实例内进行注册
作用:刷新页面后,文本框会获得焦点
new Vue({
el: '#app2',
directives: {
'focus': {
inserted: function(el, binding) {
el.focus();
}
}
}
})
<div id="app2">
<input type="text" v-focus />
</div>