vue

vue3 keep-alive vue3 keep-alive 在写法上和vue2是不一样的 假设此时你有 Home.vue和About.vue两个组件, 如果想全部缓存 如果想缓存某个组件 注意 如

Vuex 和 localStorage 的区别 （1）区别 vuex存储在内存中 localstorage则以文件的方法存储在本地，只能存储字符串类型的数据，存储对象需要 JSON的stringify

Vuex 核心概念之 Module 由于使用单一状态树，应用的所有状态会集中到一个比较大的对象。当应用变得非常复杂时，store 对象就有可能变得相当臃肿。 为了解决以上问题，Vuex 允许我们将 s

核心概念之 Action && mapActions Action 类似于 mutation，不同在于： Action 提交的是 mutation，而不是直接变更状态。 Action 可以包含任意异步

Vuex 核心概念之 Mutation && mapMutations 更改 Vuex 的 store 中的状态的唯一方法是提交 mutation。Vuex 中的 mutation 非常类似于事件：每

Vuex 核心概念之 Getter 有时候我们需要从 store 中的 state 中派生出一些状态，例如对列表进行过滤并计数： 如果有多个组件需要用到此属性，我们要么复制这个函数，或者抽取到一个共享

Vuex 是什么？ Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式 + 库。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。 store 是

Vue-router导航守卫 有的时候，需要通过路由来进行一些操作，比如最常见的登录权限验证，当用户满足条件时，才让其进入导航，否则就取消跳转，并跳到登录页面让其登录。 为此有很多种方法可以植入路由的

$route 和 $router 的区别 $route是路由信息对象，包括path,params,hash,query,fullPath,matched,name等路由信息参数 $router是路由实

Vue-Router的懒加载如何实现 首先我们先看看不使用懒加载是如何写的： 我们为什么需要使用懒加载呢？ 当打包构建应用时，JavaScript 包会变得非常大，影响页面加载。如果我们能把不同路由对

父子通信的另一种方法(ref/$refs) 首先ref这个属性如果写在子组件标签上，就可以访问子组件的数据和方法了

组件通信之祖孙组件通信 （provide / inject） provide/inject这对选项需要一起使用，允许一个祖先向所有子孙后代注入一个依赖，无论组件层次有多深，都可以使用 provide选

组件通信之事件总线 (eventBus) eventBus事件总线用的较多的是兄弟组件之间通信，当然 父子组件之间也适用，如何使用呢？ （1）需要创建一个事件中心 （2）兄弟间发送数据，假设现在有 A

组件通信之子父通信 父组件需要通过v-on自定义一个事件，子组件需要通过$emit去触发这个自定义事件，同时也可以把数据发射给父组件

父子组件通信 父组件通过props向子组件传递数据 props只能是父组件向子组件进行传值，父组件数组更新，子组件也会随之更新 props可以传递一个或一个以上的数据，对于接收的数据，可以是各种数据类

Vue 父子组件的执行顺序 加载渲染过程 父组件beforeCreate -> 父组件created -> 父组件beforeMount -> 子组件beforeCreate -> 子组件create

Vue2.x的生命周期 Vue一旦创建好实例就会拥有完整的生命周期 beforeCreate（创建前）：所有的东西都没有开始，此时data的响应式追踪、event/watcher都没有被设置，即无法访

vue初始化出现的闪动问题 在使用Vue开发的时候，其实在vue初始化之前，div还没有托管给vue，所以在网络比较慢或者页面较卡的情况下，容易看到 {{msg}}这种页面，虽然出现时间较短，但是也是

SPA spa(single page application) 仅在web页面初始化的时候加载对应的html、js和css。一旦加载完成，spa不会因为用户操作而进行页面的重新加载或者跳转；其实现机

性能优化 (1) 编码阶段 尽量减少data中的数据，data中的数据都会递归增加getter和setter，会收集对应的watcher v-if和v-for不能连用 Key保证唯一 使用路由懒加载，