提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档
文章目录
目录
1.路由守卫
1.1全局守卫
全局前置钩子router.beforeEach(fn)，导航被触发----一般登录验证
全局解析钩子router.beforeResolve(fn)，组件初始化
全局后置钩子router.afterEach(fn)，没有next，导航被确认,一般路由跳转以后用window把窗口调上去
示例应用如下：
在router文件里面的index.js里面去写入：
1.2路由独享的守卫
1、路由独享的守卫beforeEnter(to,from,next)，路由初始化(组件未初始化)----
????????a，路由鉴权-----用户体验：界面，功能，bug，效率，权限
????????b，组件异步加载情景中(插件配置：syntax-dynamic-import)
2、beforeEnter模板如下：
3、beforeEnter?示例应用如下：
1.3组件内部生命周期守卫
beforeRouteLeave 从该组件离开
beforeRouteEnter(to,from,next)，组件被激活，使用不了this，故构造指定该next 可以接收一个回调函数接收当前vm 实例----路由传参获取参数，得到初始化数据
beforeRouteUpdate(to,from,next)，组件重用时被调用----路由传参获取参数，避免增添watch 开销
导航守卫执行顺序：beforeRouteLeave < beforeEach < beforeRouteUpdate < beforeEnter < beforeRouteEnter < beforeResolve < afterEach
出发路由，预备从当前组件离开，判断路由变化，判断组件是否重用，判断新路由初始化，判断组件初始化，路由与组件初始化完毕，路由组件重定向完毕
beforeRouteLeave示例如下：
2、仓库vuex
1、下载引入vuex：vue create init? ==>?选择配置vuex
2.1 State
1、创建state状态,状态就是那个存数据的对象
2、组件中访问数据：this.$store.state.msg
2.2 Getter
1、getter就就像是store的计算属性,它会传入state对象供我们操作
2、组件中访问数据：this.$store.getters.bigMans
2.3?Mutation
组件中希望更改 Vuex 的 store 中的状态(数据)的唯一方法是提交 mutation
这样设计的原因是,只有通过mutation来更新数据,它才会去帮我们通知所有使用数据的组件更新数据 刷新UI
不要用赋值表达式直接在组件中给store设置新数据
组件中使用
????????2.1 直接触发并传值(提交载荷)：this.$store.commit('increment',{n:100})
????????2.2 可以以一个对象的形式传入：
2.4 Action
Action 提交的是 mutation，而不是直接变更状态。
Action 可以包含任意异步操作。
使用的两种情况：
????????1.直接分发：this.$store.dispatch('increment',{n:100})
? ? ? ? 2.以对象形式分发
?
2.5 Module
Vuex 允许我们将 store 分割成模块（module）。每个模块拥有自己的 state、mutation、action、getter
3、elementUI框架
安装：npm i element-ui -S
引入：
使用步骤：
在main.js里面去引入：
?
?