Vuex 总结

1. Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式 + 库

2. 核心概念名字和作用：store/State/Getter/Mutation/Action/Module

   1. store 是个大容器，包含以下所有内容
   2. State 用来读取状态，带有一个 mapState 辅助函数
   3. Getter 用来读取派生状态，附有一个 mapGetters 辅助函数
   4. Mutation 用于同步提交状态变更，附有一个 mapMutations 辅助函数
   5. Action 用于异步变更状态，但它提交的是 mutation，而不是直接变更状态。
   6. Module 用来给 store 划分模块，方便维护代码

Mutation 和 Action 为什么要分开？

为了让代码更易于维护。（Pinia 把 Mutation 和 Action 合并了）

Vue-Router总结

1. Vue Router 是 Vue.js 的官方路由。它与 Vue.js 核心深度集成，让用 Vue.js 构建单页应用变得轻而易举。

2. 核心概念名字和作用：router-link router-view 嵌套路由、Hash 模式和 History 模式、导航守卫、懒加载(import('./views/UserDetails'))

1. Hash 模式和 History 模式的区别？

   1.  一个用的 Hash，一个用的 History API
   
   2.  一个不需要后端 nginx 配合，一个需要
   

2. 导航守卫如何实现登录控制？

   router.beforeEach((to, from, next) => {
     if (to.path === '/login') return next()
     if (to是受控页面 && 没有登录) return next('/login')
     next()
   })
   

vue中的双向绑定简单总结

1. 一般使用 v-model / .sync 实现，v-model 是 v-bind:value 和 v-on:input 的语法糖

   1. v-bind:value 实现了 data ⇒ UI 的单向绑定
   2. v-on:input 实现了 UI ⇒ data 的单向绑定
   3. 加起来就是双向绑定了

2. 这两个单向绑定是如何实现的呢？

   1. 前者通过 Object.defineProperty API 给 data 创建 getter 和 setter，用于监听 data 的改变，data 一变就会安排改变 UI

   2. 后者通过 template compiler 给 DOM 添加事件监听，DOM input 的值变了就会去修改 data。

总结 为了方便自己后期查看而总结,大佬就不用看啦. 哈哈哈勿喷.