一个前端开发者

在Vue中，每个Vue实例从被创建出来到最终被销毁都会经历一个过程，就像人一样，从出生到死亡。在这一过程里会发生许许多多的事，例如设置数据监听，编译模板，组件挂载等。在Vue中，把Vue实例从被创建出来到最终被销毁的这一过程称为Vue实例的生命周期，同时，在Vue实例生命周期的不同阶段Vue还提供了不同的钩子函数，以方便用户在不同的生命周期阶段做一些额外的事情。那么，接下来的几篇文章我们就从源码角度深入剖析一下一个Vue实例在从生到死的生命周期里到底都经历了些什么，每个阶段都做了哪些事情。

正如其名，vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航。这里有很多方式植入路由导航中：全局的，单个路由独享的，或者组件级的。它可以出现多于一次，但是只能在所有的逻辑路径都不重叠的情况下，否则钩子永远都不会被解析或报错。然而，它仍然是被支持的，这意味着你可以向任何导航守卫传递第三个参数。属性来实现，并且它可以在路由地址和导航守卫上都被访问到。路由记录可以是嵌套的，因此，当一个路由匹配成功后，它可能匹配多个路由记录。，因为守卫在导航确认前被调用，因此即将登场的新组件还没被创建。

代理（Proxy）也称网络代理，是一种特殊的网络服务，允许一个（一般为客户端）通过这个服务与另一个网络终端（一般为服务器）进行非直接的连接。CORS （Cross-Origin Resource Sharing，跨域资源共享）是一个系统，它由一系列传输的HTTP头组成，这些HTTP头决定浏览器是否阻止前端 JavaScript 代码获取跨域请求的响应。一定要注意跨域是浏览器的限制，你用抓包工具抓取接口数据，是可以看到接口已经把数据返回回来了，只是浏览器的限制，你获取不到数据。发送请求中，配置请求的根路径。

如果路由很多，可以在应用初始化的时候，只挂载不需要权限控制的路由。取得后端返回的菜单后，根据菜单与路由的对应关系，筛选出可访问的路由，通过。按需挂载，路由就需要知道用户的路由权限，也就是在用户登录进来的时候就要知道当前用户拥有哪些路由权限。如果有嵌套路由，后端功能设计的时候，要注意添加相应的字段，前端拿到数据也要做相应的处理。登录后，获取用户的权限信息，然后筛选有权限访问的路由，在全局路由守卫里进行调用。每次路由跳转的时候都要判断权限，这里的判断也很简单，因为菜单的。动态挂载之间，需要将数据处理一下，将。

在vue.js中使用this.$forceUpdate()是强制更新方法，作用是触发vue的update方法。可以用在解决数据对象新增属性和数组新增数据，出现页面不渲染的问题。 在前端开发过程中数据处理尤为重要，在使用Vue时我们会事先定义好数据，数据中包含基本数据、对象、数组，其中对象中可能还会有数组，数组中也还会有数组或者对象，这样就形成了深结构数据。我们在给这些深层次的数据赋值或者给对象添加新的属性，页面上的数据并不会同步更新，

(4)在src/components/TodoMain.vue中渲染。（1）在getters中提供计算属性，在actions中提供方法。（1） 在main.js中引入pinia。（1）在getters中提供计算属性。(1)在actions中提供方法。（1）在actions中提供方法。（1）在actions中提供方法。（1）订阅store中数据的变化。目标：完成底部的统计与清空功能。（3）在footer中渲染。(2)在组件中注册事件。目标：完成任务删除功能。(2)在组件中注册事件。目标：完成任务添加功能。

总得来说，Pinia 就是 Vuex 的替代版，可以更好的兼容 Vue2，Vue3以及TypeScript。在Vuex的基础上去掉了+ pinia和vuex4一样，也是vue官方的状态管理工具(作者是 Vue 核心团队成员）+ pinia相比vuex4，对于vue3的兼容性更好+ pinia相比vuex4，具备完善的类型推荐+ pin Mutation，只保留了 state, getter和action。Pinia拥有更简洁的语法， 扁平化的代码编排，符合Vue3 的 Composition api。

为什么要学vue3:1. Vue是国内最火的前端框架,2.Vue 3 于 2022 年 2 月 7 日星期一成为新的默认版本！3. Vue3性能更高，体积更小,4. Vue3.0在经过一年的迭代后，越来越好用.动机与目的: 1. 更好的逻辑复用 与 代码组织 (composition组合式api) optionsAPI(旧) => compositionAPI（新）, 效果: 代码组织更方便了, 逻辑复用更方便了 非常利于维护!2.更好的类型推导 (typescript支持)

在修改数据之后立即使用这个方法，获取更新后的 DOM。将开启一个异步更新队列，视图需要等队列中所有数据变化完成之后，再统一进行更新。等待同一事件循环中的所有数据变化完成之后，会将队列中的事件拿来进行处理，进行。每次更新值都会触发视图更新(上面这段代码也就是会更新10万次视图)，有了。如果我们一直修改相同数据，异步操作队列还会进行去重。，而是将修改数据的操作放在了一个异步操作队列中。如果想要在修改数据后立刻得到更新后的。节点，却发现获取到的是旧值。机制，只需要更新一次，所以。数据在发现变化的时候，