VUE基础知识10

自定义指令：
1.自定义全局指令

//在main.js里面操作，首先注册全局指令，
Vue.directive(id:'upper-word',definition:(el,binding)=>{
  el.textContext = binding.value.toUpperCase();
});
//全局定义，全局使用，在某个组件里面使用即可。
<p v-upper-word = "word1"></p>
data(){
  return{
    word1:'it like,like it!'
  }
}

2.自定义局部指令

//自定义局部指令
directives:{
  'lower-word'(el,binding){
    el.textContext = binding.value.toLowerCase();
  }
}
//使用
<p v-lower-word = "word2"></p>
data(){
  return{
    word2:'IT LIKE,LIKE IT!'
  }
}

建议根据官方的文档自定义指令的时候，更加了解！