vue自定义指令

最新推荐文章于 2024-04-15 10:34:07 发布

砂糖小刀j

最新推荐文章于 2024-04-15 10:34:07 发布

阅读量68

点赞数

分类专栏： vue相关

本文链接：https://blog.csdn.net/jjabcde48/article/details/115434644

版权

Vue 自定义指令 DOM操作指令生命周期 JavaScript

关键词由CSDN通过智能技术生成

vue相关专栏收录该内容

7 篇文章 0 订阅

订阅专栏

  <div id="app">
        <div v-bgcolor="'blue'">red</div>//指令名前加v-
    </div>
    <script>
        Vue.directive("bgcolor",{//指令名
            inserted(el,bind){//指令生命周期-创建
                //el：当前标签的dom
                //bind：当前标签dom的对象
                el.style.background=bind.value
            },
            updated(el,bind) {//指令生命周期-更新
                el.style.background=bind.value
            },
        })
        var vm=new Vue({
            el:"#app",
            data:{}
        })
    </script>