自定义指令
简单定义大小写的指令
讲述全局定义和局部定义
<div id="test">
//注意msg不要写到p标签的html部分里
//大写
<p v-upper-text="msg"></p>
//小写
<p v-lower-text="msg"></p>
</div>
<script src="../js/vue.js"></script>
<script>
//全局定义,也是运用vue函数
Vue.directive('upper-text',(el,binding)=>{
el.textContent = binding.value.toUpperCase()
})
new Vue({
el:'#test',
data:{
msg:'Hellow Vue'
},
//局部定义
directives:{
'lower-text':(el,binding)=>{
el.textContent = binding.value.toLowerCase()
}
}
})
</script>