Vue - 自定义指定

注册自定义标签有两种形式：全局注册、局域注册

全局注册可以在任意地方使用，局域注册只能在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>