路由模块化 , 高频全局组件模块化
// require.context 获取文件名称 和 获取文件导出内容
require.context("文件路径", 是否有子文件, 正则匹配文件名)
例：let fileName = require.context('./', false, /\.vue/)
fileName.keys() // 获取所有文件名
fileName.keys().forEach(item => {
console.log(fileName(item).default) // 获取每个文件默认导出
})
权限
组件级: 全局自定义指令
<button :v-xxx="true"> 删除 </button>
Vue.directive('xxx', {
// 当被绑定的元素插入到 DOM 中时……
inserted: function (el, binding, vnode) {
// el 指令所绑定的元素，可以用来直接操作 DOM。
// binding 当前指令信息,传的值
// vnode Vue 编译生成的虚拟节点, 包含当前vue实例的所有属性, store, data , methods 等等
// vnode.context.$store.state.xxxx
if(binding.value) {
el.parentNode.removeChild(el)
}
}
})
页面级: 路由守卫
router.beforeEach((to, form, next) =>{
if(to.meta.token) {
if(token) {
next()
} else {
next({
path: "/login"
})
}
}else {
next()
}
})
