Vue自定义指令

比眉伴天荒 2022-01-29 02:53 491阅读 0赞

v-on 、v-model、v-show 等指令，在操作 dom 时使用了 ref 属性，其实指令也是操作dom 的一种方式，但有时，这些指令并不能满足我们的需求，因此 vue 允许我们自定义指令来操作 dom

  1. <body>
  2.     <div id="app">
  3.         <p v-color>123131321</p>
  4.     </div>
  5. </body>
  6. <script>
  7.     //全局指令
  8.     //    Vue.directive("color",{
  9.     //        inserted:function(el){
  10.     //             el.style.background="red";
  11.     //        }
  12.     //    });
  13.        var app=new Vue({
  14.            el:"#app",
  15.            directives:{
  16.                color:{
  17.                    inserted:function(el){
  18.                       el.style.background="green";
  19.                    }
  20.                }
  21.            }
  22.        });
  23. </script>

发表评论

表情：
评论列表 （有 0 条评论，491人围观）

还没有评论，来说两句吧...

相关阅读

    相关 Vue自定义指令

    自定义指令 vue里面不仅仅有内置的指令，也可以根据自己的需求构建自定义指令 它其实就是操作DOM元素的属性以及内容 通过directives属性配置自定义指令，有函

    浅浅的花香味﹌浅浅的花香味﹌/ 0 赞/ 243 阅读

    相关 vue 自定义指令

    除了核心功能默认内置的指令 (v-model 和 v-show)，Vue 也允许注册自定义指令。注意，在 Vue2.0 中，代码复用和抽象的主要形式是组件。然而，有的情况下，你

    男娘i男娘i/ 0 赞/ 492 阅读

    相关 Vue自定义指令

     `v-on 、v-model、v-show` 等指令，在操作 dom 时使用了 ref 属性，其实指令也是操作dom 的一种方式，但有时，这些指令并不能满足我们的需求，因此

    比眉伴天荒比眉伴天荒/ 0 赞/ 492 阅读

    相关 vue自定义指令

    除了核心功能默认内置的指令 (v-model 和 v-show)，Vue 也允许注册自定义指令。有的情况下，对普通 DOM 元素进行底层操作，这时候就会用到自定义指令 下面

    布满荆棘的人生布满荆棘的人生/ 0 赞/ 616 阅读