vue项目基建

路由模块化 , 高频全局组件模块化

// 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()
    }
  })
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 知识点 环境搭建(如何快速搭建 Vue 环境 / 创建一个 Vue 项目) 模板语法 计算属性 类与样式 条件&列...
    irenb阅读 570评论 0 1
  • 这篇文章主要目的是面向初接触微服务的朋友简单介绍微服务基础建设所需要的各个模块以及缘由。 起点 首先,我们得有一个...
    言射手阅读 353评论 0 6
  • 这篇文章主要目的是面向初接触微服务的朋友简单介绍微服务基础建设所需要的各个模块以及缘由。 起点 首先,我们得有一个...
    ThoughtWorks阅读 1,777评论 1 39
  • 这篇文章主要目的是面向初接触微服务的朋友简单介绍微服务基础建设所需要的各个模块以及缘由。 起点 首先,我们得有一个...
    Java小铺阅读 153评论 0 0
  • 这篇文章主要目的是面向初接触微服务的朋友简单介绍微服务基础建设所需要的各个模块以及缘由。 起点 首先,我们得有一个...
    Java小铺阅读 178评论 0 0