09 2022 档案
摘要：这是一道应用题。当打包应用时，JavaScript包会变得非常大，影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问时才加载对应组件，这样就会更加高效； // 将 // import UserDetails from "./views/UserDetails" // 替
阅读全文
摘要：思路 1.概念和必要性 2.怎么拆 3.使用细节 4.优缺点 范例 1.当项目规模变大之后，单独一个store对象会过于庞大臃肿，通过modules模块方式可以拆分开来便于维护； 2.可以按之前规则单独编写子模块代码，然后在主文件中通过modules选项组织起来：createStore（{modul
阅读全文
摘要：回答思路 给一条自己的结论 解释为什么会这样 vue3解决方法原理 范例 vue2中组件确实只能有一个根，写多根会报错，但vue3中组件已经可以多根节点了； 之所以需要这样是因为vdom是一颗单根树形结构，patch 方法在遍历的时候从根节点开始遍历，它要求只有一个根节点。组件也会转换为一个vdom
阅读全文
摘要：答题思路： 根据题目描述，这里主要探讨代码层面的优化； 回答范例： 我这里主要从Vue代码编写层面说一些优化手段，例如：代码分割、服务端渲染、组件缓存、长列表优化等 1.最常见的路由懒加载：有效拆分App尺寸，访问时才异步加载：通过vite或者webpack提供的动态加载方法import加载组件，打
阅读全文
摘要：思路 从以下几方面分门别类阐述：易用性、性能、扩展性、可维护性、开发体验等 回答范例 1.Vue3的最大设计目标是替代Vue2（皮一下），为了实现这一点，Vue3在以下几个方面做了很大改进，如：易用性、框架性能、扩展性、可维护性、开发体验等； 2.易用性方面主要是API简化，比如v-model在Vu
阅读全文
摘要：挂载过程中完成了两件最重要的事：初始化（App实例的创建、数据状态的初始化、选项的处理、建立响应式数据等）建立更新机制，把这两件事说清除即可 回答范例 1.挂载过程指的是app.mount()过程，这是个初始化过程，整体上做了两件事：初始化和建立更新机制： 2.初始化会创建组件实例、初始化组件状态、
阅读全文
摘要：问我们template到render过程，其实是问Vue编译器工作原理； 思路 1.引入vue编译器概念； 2.说明编译器的必要性； 3.阐述编译器的工作流程； 回答范例 1.Vue中有个独特的编译器模块，称为"compiler"，它的主要作用是将用户编写的template编译为js中可执行的ren
阅读全文
摘要：回答范例 1（定义）：Vuex是一个专为Vue应用开发的状态管理模式+库。它采用集中式存储，管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化； 2（必要性）：我们期待以一种简单的“单向数据流"的方式管理应用，即状态->视图->操作单向循环的方式；但当我们的应用遇到多个组件共
阅读全文
摘要：1.背景：今天看Vue3文档，发现一个网格案例中有一段 reduce的写法和作用如下： arr.reduce((o, key) => ((o[key] = 1), o), {}) // 目的 ==> 将 [ "name","power"] 转换为 { name:1,power:1 } 发现这里的回调
阅读全文
摘要：思路：查看vue官方文档：风格指南（重点关注AB级）、最佳实践（生产部署、性能、访问、安全） 回答范例 从编码风格、性能、安全等方面说几条： 1.编码风格方面： 命名组件时使用“多词"风格避免和HTML元素冲突； 使用”细节化"方式定义属性而不是只有一个属性名； 属性名声明时使用“驼峰命名"，模板或
阅读全文
摘要：缓存组件使用keep-alive组件，这是一个非常常见且有用的优化手段，vue3中keep-alive有比较大的更新，能说的点比较多； 思路 1.缓存用keep-alive，阐述它的作用与用法； 2.使用细节，例如缓存指定/排除、结合router-view和transition； 3.组件缓存后更新
阅读全文
摘要：回答范例 1.创建过程自上而下，挂载过程自下而上；即： parent created child created child mounted parent mounted 2.之所以会这样是因为Vue创建过程是一个递归过程，先创建父组件，有子组件就会创建子组件，因此创建时先有父组件再有子组件；子组件
阅读全文
摘要：思路分析： 1.先看computed，watch两者定义，列举使用上的差异； 2.列举使用场景上的差异，如何选择； 3.使用细节、注意事项； 4.vue3变化； 回答范例： 1.computed定义：接受一个 getter 函数，返回一个只读的响应式 ref 对象。该 ref 通过 .value 暴
阅读全文
摘要：答题思路： 1.nextTick是做什么的？ 2.为什么需要它呢？ 3.开发时何时使用它？ 4.下面介绍一下如何使用nextTick 5.原理解读，结合异步更新和nextTick生效方式 回答范例： 1.定义：nextTick是等待下一次DOM更新刷新的工具方法； 2.为什么使用：Vue有个异步更新
阅读全文
摘要：思路分析： 1.给出结论，key的作用是用于优化patch性能； 2.key的必要性； 3.实际使用方式； 4.总结：可从源码层面描述一下vue如何判断两个节点是否相同； 回答范例： 1.key的作用主要是为了更高效的更新虚拟DOM； 2.vue在patch过程中判断两个节点是否是相同节点是key是
阅读全文
摘要：回答范例 1.很多时候，我们需要将给定匹配模式的路由映射到同一个组件，这种情况就需要定义动态路由； 2.例如，我们可能有一个User组件，它应该对所有用户进行渲染，但用户ID不同。在Vue Router中，我们可以在路径中使用一个动态字段来实现，例如：{path:'/users/:id'，compo
阅读全文
摘要：说一说你了解的Vue3新特性 先说说API相关：官方文档展出的重要更新： Composition API SFC Composition API 语法糖 (script setup) Teleport组件 Fragments组件 Emits选项 自定义渲染器 SFC State-driven CSS
阅读全文
