VUE的自定义指令

87 阅读1分钟

src下创建文件,directive->index.js

import Vue from "vue";
import title from "./modules/title"
const directive = {
  title, 
}

//批量注册自定义指令
Object.keys(directive).forEach(key =>
  Vue.directive(key, directive[key])
)

directive->modules->index.js

    export default {
    inserted(el,binding) {
    //el是页面
        console.log(el.getAttribute('title'),'elelelel');
        console.log(binding,'binding');
        document.title = el.getAttribute('title');
    }
}

在main.js中

    import "./util/directive/index"

用起来就是<根标签 v-title title="二狗">, 此时页面名称就改变了