- 博客(45)
- 收藏
- 关注
RSS订阅原创 43.VueJS学习-如何优化 Vue 2 中 diff 算法
通过以上方法，可以有效地优化 Vue 2 中 diff 算法的性能，提高应用的响应速度和用户体验。2.选择合适的key值。
2024-09-05 16:54:57
475
原创 42.VueJS学习-Vue 2 中的 diff 算法
在 Vue 2 中，diff 算法用于比较新旧虚拟 DOM 树的差异，并根据差异进行最小化的 DOM 操作，以提高性能。
2024-09-05 16:42:34
535
原创 41.VueJS学习-VueRouter
1、全局前置守卫（beforeEach）使用方法来定义一个全局前置守卫。这个守卫会在每次路由切换之前被调用。例如：//...路由配置});// 在这里执行逻辑// to 是目标路由对象// from 是源路由对象// next 是一个函数，用于控制导航流程// 如果目标路由需要认证且用户未登录，重定向到登录页面} else {// 否则继续导航next();});to：目标路由对象，包含目标路由的信息，如路径、参数、查询参数等。from：源路由对象，包含源路由的信息。
2024-09-05 10:30:00
1163
原创 40.VueJS学习-Vue/Preset
在这个示例中，我们设置了一些常见的配置选项，如启用 Babel、Vue Router 和 Vuex 插件，使用 Sass 作为 CSS 预处理器，在保存和提交时进行代码检查，并启用 Vue 的运行时编译器。总之，Vue preset 是一种方便的方式，可以帮助开发者快速创建具有特定配置的项目，并确保项目之间的一致性。它可以帮助开发者在创建新项目时，自动应用一系列的配置选项，从而减少手动配置的工作量。创建 preset 目录：在你的项目目录之外，创建一个新的目录，用于存放预设文件。例如，可以创建一个名为。
2024-09-04 09:45:00
744
原创 38.VueJs学习-pinia原理
Pinia 和 Vuex 都是用于 Vue.js 应用的状态管理库，Pinia 在设计上借鉴了 Vuex 的一些理念同时也有很多创新之处。
2024-09-04 09:30:00
963
原创 37.VueJs学习-VueX原理
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。
2024-09-04 08:00:00
289
原创 39.VueJs学习-Vue-cli原理
Vue-cli（Vue Command Line Interface）是一个用于快速搭建 Vue.js 项目的脚手架工具。它的主要原理是通过一系列的配置文件和模板，自动化地生成项目结构和初始代码，从而提高开发效率。
2024-09-04 07:15:00
315
原创 36.VueJs学习-Vuex/modules
当应用变得庞大复杂时，将所有的状态、 mutations、actions 和 getters 放在一个单一的 store 对象中会变得难以管理。使用 modules 可以将不同功能模块的状态管理分离，提高代码的可维护性和可读性。在 Vuex 中，modules 允许你将 store 分割成多个模块，每个模块拥有自己的 state、mutations、actions 和 getters。总之，Vuex 的 modules 提供了一种强大的方式来组织和管理大型应用的状态，使得代码更加清晰、可维护和可复用。
2024-09-03 21:45:00
593
1
原创 35.VueJs学习-actions
Actions 是一个对象，其中包含一些方法，这些方法接收一个包含commit方法的上下文对象（context）作为第一个参数，并且可以接收额外的参数。});在这个例子中，定义了一个 action，它在 1 秒后提交incrementmutation 来增加count的值。
2024-09-03 21:30:00
338
原创 34.VueJs学习-VueX/mutations
Mutations 是一个对象，其中包含一些方法，这些方法接收 state 作为第一个参数，并且可以接收额外的参数。incrementdecrement和。increment和decrement分别用于增加和减少count的值，用于更新count的值为指定的payload。
2024-09-03 21:15:00
741
1
原创 33.VueJs学习-VueX/getter
Getters 是一个对象，其中包含一些函数，这些函数接收 state 作为第一个参数，并且可以接收其他 getters 作为第二个参数（可选）。state: {items: [},getters: {})在这个例子中，totalPricegetter 函数计算了items数组中所有物品价格的总和。
2024-09-03 21:00:00
812
原创 32.VueJS学习-VueX/mapState
在 Vuex 中，mapState是一个辅助函数，用于将 Vuex 的 state 映射到组件的计算属性中。
2024-09-03 20:15:00
393
原创 31.VueJS学习-构建组件方式(选项式的api/组合式的api)
在 Vue 中，有选项式 API 和组合式 API 两种不同的方式来构建组件。
2024-09-03 20:00:00
263
原创 30.VueJS学习-Vue Store(Vuex)
在 Vue 中，Vue Store（通常也称为 Vuex）是一个专为 Vue.js 应用程序开发的状态管理模式和库。
2024-09-03 19:30:00
739
原创 24.vue3学习篇-响应式原理
在 Vue 2 中，Vue.set的实现主要是为了解决在 Vue 实例创建后，向响应式对象添加新属性时，新属性无法触发视图更新的问题。以下是对Vue.set实现原理的分析。
2024-08-30 21:30:00
1239
原创 25.vue3学习篇-生命周期和新特性
Vue 3 允许开发者创建自定义渲染器，以适应不同的平台和环境。这使得 Vue 可以在更多的场景下使用，例如原生移动应用开发、服务器端渲染等。
2024-08-30 21:00:00
2399
原创 26.Vue3学习篇-定义全局变量
请注意，这种方式定义的全局变量并不是真正的全局变量，而是在组件树中进行传递和共享的。另外在 Vue 3 中，可以使用。来定义全局变量和方法。在 Vue 3 中，可以使用。在其他组件中，可以使用。
2024-08-30 19:30:00
3883
原创 28.vue3学习篇- teleport
传送的内容会脱离其原始组件的作用域，这意味着父组件中的样式和事件绑定可能不会自动应用到传送的内容上。如果需要，可以在传送的目标位置手动添加适当的样式和事件处理。是一个强大的功能，它允许你将一个组件的模板内容渲染到 DOM 中的不同位置，而不是在该组件的父级组件的 DOM 层级中渲染。你还可以通过传递一个 CSS 选择器字符串或一个实际的 DOM 元素引用，将内容传送到特定的目标位置。在处理模态框、弹出窗口或需要将特定内容放置在特定位置而不受父组件布局限制的情况下非常有用。在 Vue 3 中，
2024-08-30 18:30:00
358
原创 29.vue3学习篇-自定义hooks
通过自定义 Hooks，你可以将复杂的逻辑封装起来，使得代码更加清晰、可维护和可复用。同时，自定义 Hooks 也可以帮助你在不同的组件之间共享逻辑，避免重复代码的编写。在 Vue 3 中，自定义 Hooks 是一种将可复用的逻辑提取出来的有效方式。1. 创建一个以use开头的函数，例如useMousePosition。1.在你的 Vue 组件中引入自定义 Hook。
2024-08-30 18:15:00
507
原创 23.vue学习篇-插槽
在 Vue 中，插槽（Slots）是一种非常有用的功能，它允许父组件向子组件传递内容，使得子组件具有更高的可扩展性和灵活性。
2024-08-30 06:30:00
1085
原创 22.vue学习篇-过渡&动画
问题：在JS里面实现元素的过渡动画，有哪几种思路？1. JS操作style，transition: all 1s ease(缓动随意)2. JS操作className，切换类名-[在不用第三方库的时候，最推荐这个方法，vue源码也是用的这个方法实现]vue源码中，通过这个方法实现transitionstart方法，transitionend方法，监听过渡是否完成3. JS代码，结合requestAnimationFrame4. 结合第三方库，比较多的用gsap，velocity.js类库。
2024-08-29 19:30:00
1031
原创 21.vue学习篇-props，provide，inject，pinia
都是 Vue 中用于管理组件之间状态传递和共享的有效机制。在实际应用中，可以根据具体的需求选择合适的方式来实现组件之间的通信和状态管理。都是用于管理组件之间状态传递和共享的机制，它们各自有不同的用途和特点。
2024-08-29 13:45:00
737
原创 20.vue3学习篇-Composition
总之，Vue 3 的 Composition API 提供了一种更灵活、可维护和可复用的方式来编写组件逻辑。它使得代码的组织更加清晰，逻辑复用更加容易，并且提高了代码的可读性和可测试性。在 Vue 3 中，Composition API 是一种新的编写组件逻辑的方式，它提供了更灵活和可维护的代码组织方式。
2024-08-29 11:30:00
706
原创 24. vue学习篇-插件
在 Vue 中，插件是一种用于增强 Vue 功能的方式。插件可以为 Vue 添加全局方法、全局属性、全局指令、混入等，从而扩展 Vue 的功能。
2024-08-29 10:30:00
924
原创 19.VUE2学习篇-mixin
在 Vue 2 中，mixin（混入）是一种用于代码复用的机制。它允许你将一些可复用的逻辑提取出来，然后在多个组件中混入这些逻辑。1.创建一个mixin对象。
2024-08-28 15:27:44
490
原创 18.JS学习篇- react 状态管理
在 React 中，状态管理是构建可维护和可扩展应用的重要方面。良好的状态管理可以使代码更清晰、易于理解，并提高开发效率。
2024-08-28 10:30:00
817
原创 17.JS学习篇-错误边界ErrorBoundary
错误边界的出现就是为了解决这个问题，它可以捕获这些错误，显示一个友好的错误页面或者进行其他的错误处理，从而保证应用的稳定性。在前端开发中，错误边界（Error Boundary）是一种用于处理组件内错误的机制，它可以捕获并处理子组件在渲染过程中发生的错误，防止这些错误导致整个应用崩溃。2. 使用错误边界组件：可以将可能会抛出错误的组件包裹在错误边界组件中，这样当被包裹的组件发生错误时，错误边界组件会捕获并处理这个错误。1. 在 React 中，可以通过创建一个类组件来实现错误边界。
2024-08-28 09:00:00
353
原创 16.JS学习篇-同构Helmet
在同构应用中使用 Helmet 可以为前后端提供一致的安全防护。总之，在同构应用中使用 Helmet 可以为你的应用提供更好的安全防护，提高应用的安全性和可靠性。同时，同构应用的优势也可以为用户提供更好的体验和性能。在同构应用中，你可以在服务器端和客户端分别使用 Helmet 中间件来提供安全防护。Helmet 提供了一系列的安全中间件，可以帮助你保护 Node.js 应用免受各种安全攻击。在这个示例中，我们在服务器端使用 Helmet 中间件来设置安全头信息，在客户端使用。
2024-08-27 19:30:00
975
原创 15.JS学习篇- CSS 变量文件
总之，在大型项目中使用 CSS 变量文件可以提高代码的可维护性、实现主题切换功能，并增强代码的复用性。通过合理地定义和使用变量，可以使项目的样式管理更加高效和灵活。在大型项目中使用 CSS 变量文件是一种非常有效的方式，可以方便地管理公共样式和实现主题切换等功能。
2024-08-27 15:10:51
754
原创 14.JS学习篇-CSR和SSR
在前端开发中，CSR（Client-Side Rendering，客户端渲染）和 SSR（Server-Side Rendering，服务端渲染）是两种不同的渲染方式。
2024-08-27 14:49:55
684
原创 13.JS学习篇-ES6 React 项目模板
1.项目初始化脚手架1.前端编码规范工程化（lint工具、Node CLI等）eslintstylelintcommitlintTypescriptReactVue等不同类型的前端项目下的标准的语法限制；2.相关基础功能•React前端页面展示框架；•Redux：状态管理；•：前端路由；•：支持将Redux与进行绑定；•Express服务端；•TypeScript类型检查；•Webpack打包构建工具；•BabelES6+转ES5工具；•。
2024-08-26 15:13:15
2773
原创 11.TS学习篇-typeScript
TypeScript 是一种由微软开发的开源编程语言，它是 JavaScript 的超集，为 JavaScript 增加了静态类型系统。在前端开发中，TypeScript 具有以下重要作用和特点：1.优势1. 静态类型检查2. 更好的代码智能感知和自动补全3. 面向大型项目的可扩展性4. 与 JavaScript 完全兼容5. 开发工具1.代码编辑器：vscode2. 构建工具：webpack，vite。
2024-08-23 10:03:53
987
原创 9.JS学习篇-async / await
在前端开发中，是一种用于处理异步操作的语法糖，它使得异步代码看起来更像同步代码，从而提高了代码的可读性和可维护性。
2024-08-21 15:49:03
1037
原创 8.JS学习篇-箭头函数和普通函数
1.基本语法使用function关键字进行定义。函数可以有零个或多个参数，参数之间用逗号分隔。函数体包含一系列语句，用于执行特定的任务，并可以通过return语句返回一个值。2.函数声明和函数表达式函数声明是在代码中独立出现的函数定义，会在代码执行前被解析和提升到作用域的顶部。函数表达式是将函数赋值给一个变量，可以在任何位置定义。
2024-08-21 15:35:30
1207
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人