Vue常用指令

1.什么是指令?

指令就是Vue内部提供的一些自定义属性,

这些属性中封装好了Vue内部实现的一些功能

只要使用这些指令就可以使用Vue中实现的这些功能

2.Vue数据绑定的特点

只要数据发生变化, 界面就会跟着变化

 

v-once：让界面不要跟着数据变化, 只渲染一次、

v-clock：数据渲染之后自动显示元素 （利用v-cloak配合 [v-cloak]:{display: none}默认先隐藏未渲染的界面，等到生成HTML渲染之后再重新显示）

v-text：就相当于过去学习的innerText

v-html：就相当于过去学习的html（可以解析HTML）

 

3.Vue全局自定义指令

 

directive 方法接收两个参数 一、指令名称 二、对象

指令可以在不同的生命周期阶段执行

bind: 指令被绑定到元素上的时候执行;

inserted: 绑定指令的元素被添加到父元素上的时候执行;

 

 

Vue.directive("color", {
    bind(el, binding) {
      el.style.color = binding.value;
   },
});