jiadsadfasfs的博客

项目的目录结构很重要，因为目录结构能体现很多东西，怎么规划目录结构可能每个人有自己的理解，但是按照一定的规范去进行目录的设计，能让项目整个架构看起来更为简洁，更加易用。这样做的好处在于，无论你的模块文件夹内部有多乱，外部引用的时候，都是从一个入口文件引入，这样就很好的实现了隔离，如果后续有重构需求，你就会发现这种方式的优点。文件夹，这个文件夹里面应该包含我们项目所有的路由模块，并且仅应该包含路由模块，而不应该有别的其他的非路由模块的文件夹。文件夹，里面放着所有的项目需要的资源，

虚拟 DOM （）这个概念相信大家都不陌生，从React到Vue，虚拟DOM为这两个框架都带来了跨平台的能力（和Weex实际上它只是一层对真实DOM的抽象，以JavaScript对象 (VNode节点) 作为基础的树，用对象的属性来描述节点，最终可以通过一系列操作使这棵树映射到真实环境上在Javascript对象中，虚拟DOM表现为一个Object对象。并且最少包含标签名 (tag)、属性 (attrs) 和子元素对象 (children) 三个属性，不同框架对这三个属性的名命可能会有差别创建虚拟。

关于vue3的重构背景，尤大是这样说的：「Vue 新版本的理念成型于 2018 年末，当时 Vue 2 的代码库已经有两岁半了。比起通用软件的生命周期来这好像也没那么久，但在这段时期，前端世界已经今昔非比了在我们更新（和重写）Vue 的主要版本时，主要考虑两点因素：首先是新的 JavaScript 语言特性在主流浏览器中的受支持水平；其次是当前代码库中随时间推移而逐渐暴露出来的一些设计和架构问题」利用新的语言特性(es6)解决架构问题。

取得后端返回的菜单后，根据菜单与路由的对应关系，筛选出可访问的路由，通过。菜单跟路由耦合在一起，定义路由的时候还有添加菜单显示标题，图标之类的信息，而且路由不一定作为菜单显示，还要多加字段进行标识。路由方面，用户登录后只能看到自己有权访问的导航菜单，也只能访问自己有权访问的路由地址，否则将跳转。按需挂载，路由就需要知道用户的路由权限，也就是在用户登录进来的时候就要知道当前用户拥有哪些路由权限。如果有嵌套路由，后端功能设计的时候，要注意添加相应的字段，前端拿到数据也要做相应的处理。

返回的对象可以直接用于渲染函数和计算属性内，并且会在发生变更时触发相应的更新。也可以作为最小化的跨组件状态存储器。中，则会返回一个可响应的代理，而对源对象直接进行变更仍然是不可响应的。源码位置：src\core\observer\index.js。，但是实现的功能不是太复杂，而使用上面两个又有点繁琐。变更，它和被返回的对象是同一个对象。在非父子组件通信时，可以使用通常的。，让一个对象变成响应式数据。中，被传入的对象会直接被。翻译过来我们可以理解成。

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

源码位置：src\platforms\web\runtime\index.js。源码位置：src\core\instance\lifecycle.js。源码位置：src\core\instance\render.js。源码位置：src\core\instance\index.js。源码位置：src\core\instance\state.js。源码位置：src\core\instance\init.js。过程中是如何完成数据的绑定，又是如何将数据渲染到视图的等等。的时候，数据已经初始化完成，能够访问。

事件的细节，让我们不再需要花大量的时间去处理这些烦恼的事情，而能有更多的精力专注于程序的逻辑处理。在程序世界里，修饰符是用于限定类型以及类型成员的声明的一种符号。事件会让我们的网页变卡，因此我们使用这个修饰符的时候，相当于给。使用.native修饰符来操作普通HTML标签是会令事件失效的。在移动端，当我们在监听元素滚动事件的时候，会一直触发。在我们填完信息，光标离开标签的时候，才会将值赋予给。自动过滤用户输入的首空格字符，而中间的空格不会过滤。内置标签那样监听根元素的原生事件，否则组件上使用。

在日常的开发中，我们经常会遇到在不同的组件中经常会需要用到一些相同或者相似的代码，这些代码的功能相对独立。类通常作为功能模块使用，在需要该功能时“混入”，有利于代码复用又避免了多继承的复杂。通过观察上面两个组件，发现两者的逻辑是相同，代码控制显示也是相同的，这时候。是面向对象程序设计语言中的类，提供了方法的实现。但是如果相同选项为生命周期钩子的时候，会合并成一个数组，先执行。对象相同的选项的时候，进行递归合并的时候组件的选项会覆盖。对象的选项都将被混入该组件本身的选项中来。PS：全局混入常用于插件的编写。

(例如。

值，用其与新的缓存规则进行匹配，如果匹配不上，则表示在新的缓存规则下该组件已经不需要被缓存，则调用。发生了变化，即表示定义需要缓存的组件的规则或者不需要缓存的组件的规则发生了变化，那么就执行。设置了 keep-alive 缓存的组件，会多出两个生命周期钩子（中的内置组件，能在组件切换过程中将状态保留在内存中，防止重复渲染。包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。中缓存组件的数量是否超过了设置的最大缓存数量值。表明该组件还没有被缓存过，则以该组件的。缓存的组件被激活的时候，都会执行。

指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回。作用在不同标签时候，是先进行判断，再进行列表的渲染。模板编译的时候，会将指令系统转化成可执行的。的列表渲染函数，函数内部都会进行一次。指令基于一个数组来渲染一个列表。是源数据数组或者对象，而。则是被迭代的数组元素的别名。形式的特殊语法，其中。模板指令的代码都会生成在。值是独一无二的，这便于。这时候我们可以看到，

SPA首屏加载

在组件的选项中定义本地的过滤器filters: {if (!if (!})new Vue({// ...})注意：当全局过滤器和局部过滤器重名时，会采用局部过滤器过滤器函数总接收表达式的值 (之前的操作链的结果) 作为第一个参数。在上述例子中，capitalize过滤器函数将会收到message的值作为第一个参数在这个例子中，filterA被定义为接收单个参数的过滤器函数，表达式message的值将作为参数传入到函数中。然后继续调用同样被定义为接收单个参数的过滤器函数filterB，将。

你是怎么处理vue项目中的错误的？

开始之前我们先学习一下指令系统这个词指令系统是计算机硬件的语言系统，也叫机器语言，它是系统程序员看到的计算机的主要属性。因此指令系统表征了计算机的基本功能决定了机器所要求的能力在vue中提供了一套为数据驱动视图更为方便的操作，这些操作被称为指令系统我们看到的v-开头的行内属性，都是指令，不同的指令可以完成或实现不同的功能除了核心功能默认内置的指令 (v-model和v-show)，Vue也允许注册自定义指令。

第三次循环中，发现E没有找到，这时候只能直接创建新的真实节点 E，插入到第二次创建的 C 节点之后。之间的所有节点，也就是节点F，直接创建 F 节点对应的真实节点放到 B 节点后面。后创建了 A 的真实节点，插入到前一次创建的 E 节点后面。后创建了 C 的真实节点插入到第一次创建的 D 节点后面。后创建了 B 真实节点 插入到前一次创建的 A 节点后面。第二次循环后，同样是旧节点的末尾和新节点的开头(都是 C)相同，同理，第一次循环后，发现旧节点D与新节点D相同，直接复用旧节点D作为。

动态给vue的data添加一个新的属性会发生什么

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

vue组件和插件有什么区别

vue组件之间的通信方式有哪些

axios 原理 axios使用

Vue项目中有封装过axios吗？主要是封装哪方面的？

2024 大厂进阶Vue3面试题及答案（10道）

说说你对SPA（单页应用）的理解

2024 大厂进阶Vue2面试题及答案（10道）

双向绑定得理解

说说你对vue的理解

vue项目本地开发完成后部署到服务器后报404是什么原因呢

为什么data属性是一个函数而不是一个对象

SPA（单页应用）首屏加载速度慢怎么解决

为什么Vue中的v-if和v-for不建议一起用

请描述下你对vue生命周期的理解？在created和mounted这两个生命周期中请求数据有什么区别呢？

Vue实例挂载的过程

是真正的条件渲染，它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。只有渲染条件为假时，并不做操作，直到为真才渲染。切换有一个局部编译/卸载的过程，切换过程中合适地销毁和重建内部的事件监听和子组件；的作用效果是相同的(不含v-else)，都能控制元素在页面是否显示。如果需要非常频繁地切换，则使用 v-show 较好。如果在运行时条件很少改变，则使用 v-if 较好。不管初始条件是什么，元素总是会被渲染。的时候不会触发组件的生命周期。有更高的初始渲染消耗；要复杂的多，因为还有。