自定义指令directive

时间：2020-08-25 15:47:23 阅读：69 评论：0 收藏：0 [点我收藏+]

// 注册一个全局自定义指令 `v-focus`
Vue.directive(‘focus‘, {
  // 当被绑定的元素插入到 DOM 中时……
  inserted: function (el) {
    // 聚焦元素
    el.focus()
  }
})

如果想注册局部指令，组件中也接受一个 directives 的选项：

directives: {
  focus: {
    // 指令的定义
    inserted: function (el) {
      el.focus()
    }
  }
}

然后你可以在模板中任何元素上使用新的 v-focus property，如下：

<input v-focus>

//例子

<div>

</div>

</template>

// import Vue from ‘vue‘

// Vue.directive("hello",function(el,binding,vnode){

// el.style["color"]= binding.value;

// })

export default {

name: ‘Element‘,

data() {

return {

red:"red",

green:‘green‘

}

directives:{

hello:function(el,binding,vnode){

console.log(el,binding,vnode)

el.style["color"]= binding.value;

}

</script>

原文：https://www.cnblogs.com/hellofangfang/p/13560003.html

踩

(0)

评论一句话评论（0）

分享档案

更多>