From a0721c55de141ceb2e811ed5eafdc5b95c301a0a Mon Sep 17 00:00:00 2001 From: zhaoshuangshi Date: Thu, 2 Mar 2023 09:12:05 +0800 Subject: [PATCH] =?UTF-8?q?=E4=B9=A0=E9=A2=98=E6=9B=B4=E6=96=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../1.SSR/exercises.md" | 16 +++++++++----- .../exercises.md" | 11 +++++----- .../exercises.md" | 2 +- .../exercises.md" | 2 +- .../exercises.md" | 21 ++++++++++++------- 5 files changed, 32 insertions(+), 20 deletions(-) diff --git "a/data/3.Vue\351\253\230\351\230\266/1.Vue\346\234\215\345\212\241\347\253\257\346\270\262\346\237\223/1.SSR/exercises.md" "b/data/3.Vue\351\253\230\351\230\266/1.Vue\346\234\215\345\212\241\347\253\257\346\270\262\346\237\223/1.SSR/exercises.md" index b4fb5ad..8fd065c 100644 --- "a/data/3.Vue\351\253\230\351\230\266/1.Vue\346\234\215\345\212\241\347\253\257\346\270\262\346\237\223/1.SSR/exercises.md" +++ "b/data/3.Vue\351\253\230\351\230\266/1.Vue\346\234\215\345\212\241\347\253\257\346\270\262\346\237\223/1.SSR/exercises.md" @@ -1,23 +1,29 @@ # SSR -以下哪个选项描述了Vue的SSR特性? +补充文中填空: + +服务器端渲染 (SSR):服务器端渲染是 Vue 框架提供的一项重要特性。SSR 可以在服务器端生成 HTML 静态页面,将其发送到浏览器端显示,提高了首屏加载速度和SEO优化,同时也有利于提高网站性能和用户体验。 + +在 SSR 中,Vue 组件会在服务器端被渲染成 HTML 静态页面,然后将这些静态页面发送到浏览器端,浏览器端再渲染出最终的页面。相比客户端渲染,SSR 更加灵活、SEO 友好,但相应的复杂度和开发成本也更高。 + +Vue 的 SSR 特性通过 `(__1__) `库来实现,该库提供了一个 `(__2__) ` 方法来创建一个renderer,它可以将 Vue 组件转换成静态 HTML 字符串。在使用时,我们需要在服务器端启动一个 Node.js 服务,监听客户端的请求,将需要渲染的 Vue 组件渲染成 HTML 字符串,然后将其返回给客户端。 ## 答案 -可以使用Vue组件在服务器端渲染HTML。 +1、vue-server-renderer;2、createRenderer; ## 选项 ### A -可以在客户端和服务器端同时运行Vue实例。 +1、vue-server-renderer;2、renderToString; ### B -可以使用Vue的vuex状态管理器在服务器端管理状态。 +1、vue-server-create;2、createRender; ### C -可以使用Vue插件在服务器端扩展Vue实例的功能。 \ No newline at end of file +1、vue-server-create;2、renderToString; \ No newline at end of file diff --git "a/data/3.Vue\351\253\230\351\230\266/7.vue3\345\237\272\347\241\200\357\274\210JS\357\274\211/2.\346\236\204\345\273\272\345\267\245\345\205\267Vite/exercises.md" "b/data/3.Vue\351\253\230\351\230\266/7.vue3\345\237\272\347\241\200\357\274\210JS\357\274\211/2.\346\236\204\345\273\272\345\267\245\345\205\267Vite/exercises.md" index 4f47b2b..a35d70b 100644 --- "a/data/3.Vue\351\253\230\351\230\266/7.vue3\345\237\272\347\241\200\357\274\210JS\357\274\211/2.\346\236\204\345\273\272\345\267\245\345\205\267Vite/exercises.md" +++ "b/data/3.Vue\351\253\230\351\230\266/7.vue3\345\237\272\347\241\200\357\274\210JS\357\274\211/2.\346\236\204\345\273\272\345\267\245\345\205\267Vite/exercises.md" @@ -1,22 +1,21 @@ # 构建工具Vite -Vite是一款基于什么技术实现的前端构建工具? +在使用 Vite 构建 Vue 3 应用时,下列选项对 Vite 特性描述错误的是? ## 答案 -Rollup +Vite虽然支持了很多插件,但是对于 Babel、PostCSS 目前还未支持。 ## 选项 ### A -Webpack +它基于 原生 ES 模块 提供了 丰富的内建功能,如速度快到惊人的 模块热更新(HMR)。 ### B -Gulp +它使用 Rollup 打包你的代码,并且它是预配置的,可输出用于生产环境的高度优化过的静态资源。 ### C -Browserify - +Vite 支持自定义插件和配置,方便开发者根据项目需要进行定制。 diff --git "a/data/3.Vue\351\253\230\351\230\266/7.vue3\345\237\272\347\241\200\357\274\210JS\357\274\211/4.reactive\345\207\275\346\225\260\343\200\201ref\345\207\275\346\225\260/exercises.md" "b/data/3.Vue\351\253\230\351\230\266/7.vue3\345\237\272\347\241\200\357\274\210JS\357\274\211/4.reactive\345\207\275\346\225\260\343\200\201ref\345\207\275\346\225\260/exercises.md" index 5e541da..9f8848b 100644 --- "a/data/3.Vue\351\253\230\351\230\266/7.vue3\345\237\272\347\241\200\357\274\210JS\357\274\211/4.reactive\345\207\275\346\225\260\343\200\201ref\345\207\275\346\225\260/exercises.md" +++ "b/data/3.Vue\351\253\230\351\230\266/7.vue3\345\237\272\347\241\200\357\274\210JS\357\274\211/4.reactive\345\207\275\346\225\260\343\200\201ref\345\207\275\346\225\260/exercises.md" @@ -1,6 +1,6 @@ # reactive函数、ref函数 -在Vue3中,以下哪些说法是关于reactive和ref函数的异同点是正确的? +在Vue3中,下列关于reactive和ref函数描述正确的是? ## 答案 diff --git "a/data/3.Vue\351\253\230\351\230\266/7.vue3\345\237\272\347\241\200\357\274\210JS\357\274\211/8.Vue3\347\273\204\344\273\266\351\200\232\344\277\241/exercises.md" "b/data/3.Vue\351\253\230\351\230\266/7.vue3\345\237\272\347\241\200\357\274\210JS\357\274\211/8.Vue3\347\273\204\344\273\266\351\200\232\344\277\241/exercises.md" index 0d4437a..861fb48 100644 --- "a/data/3.Vue\351\253\230\351\230\266/7.vue3\345\237\272\347\241\200\357\274\210JS\357\274\211/8.Vue3\347\273\204\344\273\266\351\200\232\344\277\241/exercises.md" +++ "b/data/3.Vue\351\253\230\351\230\266/7.vue3\345\237\272\347\241\200\357\274\210JS\357\274\211/8.Vue3\347\273\204\344\273\266\351\200\232\344\277\241/exercises.md" @@ -1,6 +1,6 @@ # Vue3组件通信 -在Vue3中,以下哪个选项不能用于父组件向子组件传递数据? +在Vue3中,以下哪个方式不能实现父组件向子组件传递数据? ## 答案 diff --git "a/data/3.Vue\351\253\230\351\230\266/8.\346\270\262\346\237\223\345\231\250/2.diff\347\256\227\346\263\225/exercises.md" "b/data/3.Vue\351\253\230\351\230\266/8.\346\270\262\346\237\223\345\231\250/2.diff\347\256\227\346\263\225/exercises.md" index a7f58d3..768433f 100644 --- "a/data/3.Vue\351\253\230\351\230\266/8.\346\270\262\346\237\223\345\231\250/2.diff\347\256\227\346\263\225/exercises.md" +++ "b/data/3.Vue\351\253\230\351\230\266/8.\346\270\262\346\237\223\345\231\250/2.diff\347\256\227\346\263\225/exercises.md" @@ -1,25 +1,32 @@ # diff算法 -在Vue2中,以下哪种情况会触发diff算法说法正确的是? +Vue 的 diff 算法是用于比较 Virtual DOM 树的算法。在 Virtual DOM 中,每一个元素节点都是一个 JavaScript 对象,当数据发生变化时,Vue 会创建新的 Virtual DOM 树,并与旧的 Virtual DOM 树进行比较,找出两者之间的差异,然后只更新发生变化的部分。 + +Vue 的 diff 算法采用了一些优化策略,例如同级比较、key 的使用等,以减少比较的次数和提高比较的效率,从而提高应用的性能。 + +
+ +Vue2的diff算法执行中,同一层级的数据如果出现新节点和旧节点的tag相同,但是key不同,Vue会进行怎样的操作? + +
+ ## 答案 -父组件重新渲染时,子组件的slot内容发生变化会触发。 +销毁旧节点,创建新节点,并将新节点插入到旧节点的位置。 ## 选项 ### A -父组件重新渲染时,子组件的props发生变化一定会触发。 +直接将旧节点的内容替换成新节点的内容。 ### B -父组件重新渲染时,子组件的data发生变化一定会触发。 +进行复用,对比新旧节点的属性和子节点,进行更新。 ### C -父组件重新渲染时,子组件的样式发生变化一定会触发。 - - +报错,要求新节点和旧节点的key必须相同。 -- GitLab