- 博客(81)
- 收藏
- 关注
RSS订阅原创 vue3学习教程第四十一节 （pinia可持续化的应用）即页面刷新依然可以保持原有状态
pinia 中数据可持续化、结合前端本地缓存，vue3中使用pinia 将数据状态可持续化实现方案，注意事项。
2024-06-18 22:33:51
413
1
原创 vue3学习教程第四十节（pinia的用法注意事项解构store）
vue3 组合式API 中pinia的使用以及注意事项，解构获取 store 中数据，state、actions、getters 的应用
2024-06-18 22:25:07
527
原创 vue3学习教程第三十九节（TS中的高级类型，分类以及使用注意事项）
前言：为什么需要使用高级类型，正常的类型不能满足日常的业务需求，对于复杂的数据结构、函数签名、类型转换，我们需要使用高级类型来处理，常用的高级类型包含以下几种：常用的类型定义：基本类型： 像 number、string、boolean 这样的基本类型，它们表示简单的数据。对象类型： 可以使用对象字面量、接口、类等定义对象类型。数组和元组： 具有内置的数组类型和元组类型，用于处理集合数据。函数类型： 支持函数类型，包括参数类型和返回值类型。是通过 & 符号，将多个类型或者方法合并为一个类型使用于对象合
2024-06-12 22:20:15
428
原创 vue3学习教程第三十六节（自定义插件）
插件 (Plugins) 是一种能为Vue添加全局功能的工具代码。主要应用于以下四个方面1、通过和注册一到多个全局组件或自定义指令。2、通过使一个资源可被注入进整个应用。3、向中添加一些全局实例属性或方法4、一个可能上述三种都包含了的功能库 (例如vue-router。
2024-05-30 21:53:41
646
1
原创 vue3第三十五节（TS 之 泛型）
泛型的本质是参数化类型，也就是说所操作的数据类型被指定为一个参数。这种参数类型可以用在类、接口和方法的创建中，分别称为泛型类泛型接口泛型方法。泛型使用来定义类型，中的T，也可以是U也可以是其他合法的字母，建议大写。泛型可以理解为不确定单独类型，函数中使用泛型，可以约束函数的参数和返回值类型相同。
2024-05-28 22:22:15
527
原创 vue3学习教程第三十四节（TS 之 interface 与 type 的异同）
vue3 组合式API使用 TS时，interface与type的使用注意事项以及差异
2024-05-23 22:17:20
724
原创 vue3学习教程第三十三节（TS 之 computed watch）
vue3 中计算属性 computed 与 监听函数 watch 的 ts写法
2024-05-23 22:02:27
401
原创 vue3学习教程第三十二节（TS 之 ref reactive defineProps）
时候，编译模板会自动根据script 中定义的数据类型而推断出属性的类型（当没有声明属性类型时候）：在使用时候类型定义要与调用的方法保持一致，不然会导致对应的属性 没有该方法而报错；由于string 类型的属性是没有 toFixed() 方法的，故报错，如下图。类型声明或者调用 ref时传入一个泛型参数 来覆盖推断类型。创建的响应式，只能是对象类型，不能是基本类型;vue3 文件中 当我们在。指定复杂类型时候，通过。
2024-05-19 22:53:26
1005
1
原创 vue3第三十一节（vue3中定义局部样式，以及样式穿透）
选择器的末尾（编译后的生成的css语句）加一个当前组件的data属性选择器（如[data-v-123]）来私有化样式。，然后，给CSS选择器额外添加一个对应的属性选择器来选择该组件中dom，这种做法使得样式只作用于含有该属性的。c、如果组件内部包含有其他组件，只会给其他组件的最外层标签加上当前组件的data属性。而样式的穿透 多用于在项目自定义修改第三方 UI库的样式，用于满足本身项目的需要；会给一个组件中的所有dom添加了一个独一无二的动态属性。转译实现的），达到样式私有化模块化的目的。
2024-05-16 22:15:22
483
原创 vue3第三十节（vue3 vite中使用sass）
是一种CSS预处理器，它扩展了CSS的功能，提供了更高级的语法和特性，例如变量、嵌套、混合、继承和颜色功能等，这些特性可以帮助开发者更高效地管理和维护样式表。Sass语法是基于缩进（缩进花括号）的，它与传统的CSS语法类似，但添加了一些额外的规则和语法结构。Sass代码需要编译成CSS代码才能在浏览器中呈现。
2024-05-16 22:02:09
819
原创 vue3 学习教程第二十九节 （vue3 事件循环之nextTick）
在处理大量数据时，Vue.js 可能会变得有点慢，因为它需要时间来处理所有的数据并更新DOM。在这种情况下，你可能想要使用 nextTick() 来分批处理数据，以便给浏览器一些时间来更新DOM。在这种情况下，你可以使用 nextTick() 来确保你的代码在DOM更新后执行。在这种情况下，你可以使用 nextTick() 来确保你的代码在DOM更新后执行。然后，在下一个的事件循环“tick”中，Vue 刷新队列并执行实际 (已去重的) 工作。简单的理解是，当数据更新了，在dom中渲染后，自动执行函数。
2024-05-13 23:16:48
374
原创 vue3 学习教程第二十八节 （vue3 事件循环之JS事件循环）
事件循环就是消息队列，是浏览器渲染主线程的工作方式；过去将消息队列，简单的分为宏任务和微任务两种队列，而对于现在复杂多变的浏览器环境，显然这种处理方式已经不能满足使用，取而代之的是一种更加灵活多变的处理方式；W3C给出的解释是：每个任务有不同的类型，相同类型的任务会被放入同一个执行队列中，不同的任务可以隶属于不同的队列，不同的任务队列有不同的执行优先级，在一次事件循环中，浏览器自行决定取哪一个任务队列，但是浏览器必须有一个微任务队列，并且微任务队列中的任务执行级别最高，优先执行微任务；宏任务。
2024-05-13 22:29:48
849
原创 vue3学习教程第二十四节（JSX用法）
vue3中JSX的使用及注意事项，自定义组件，插值语法，条件渲染等，以及与template模板语法的差异
2024-04-25 22:48:22
815
原创 vue3学习教程第二十三节（全局属性方法应用）
vue3中全局方法使用，provide | inject 依赖注入法，globalProperties全局属性对象
2024-04-25 21:20:07
344
1
原创 vue3学习教程第二十二节（defineOptions用途）
vue3中新增加的 defineOptions() 用于设置父子组件属性的透传，以及设置组件的name属性
2024-04-19 21:12:47
1716
1
原创 vue3学习教程第二十一节（新增编译宏defineExpose）
vue3 中新增编译宏 defineExpose() 用于父子组件之间通讯，子组件通过defineExpose()抛出可以让，父组件链式调用子组件中的属性方法
2024-04-17 21:38:23
354
原创 vue3学习教程第二十节（新增编译宏defineModel）
vue3中新增编译宏 defineModel()，使用注意事项，解决父子组件之间数据双向绑定
2024-04-17 21:17:33
1714
原创 vue3第十九节（编译宏defineProps与defineEmits）用法注意事项
vue 中如何使用 defineProps() 和 defineEmits()编译宏，以及对应的注意事项
2024-04-15 22:19:52
557
原创 vue3学习教程第十八节（diff算法）
vue 项目中diff的用途，以及vue3项目相比较 vue2中diff做了那些优化提升，及vue3新增加的特性，使得vue3加载更快、编译更快、算法的效率提升更高
2024-04-11 23:50:19
661
1
原创 vue3学习教程第十六节（keep-alive 内置组件）
keep-alive是vue中的内置组件，能在组件切换过程中将状态保留在内存中，防止重复渲染DOM；keep-alive 包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们
2024-04-09 21:39:12
623
原创 vue3学习教程第十五节（Suepense）
suepense是先渲染的默认插槽中的内容，而在默认插槽渲染的进程中，如果遇见异步加载的组件或数据，则会渲染。提供了更平滑的解决方案，使UI加载更加流畅，有助于用户体验的提升，避免了加载过程中的空白或闪烁问题。插槽中的 加载中 数据会自动消失，进而渲染为默认插槽中的数据；包裹这些组件，直到所有需要的数据加载完成后再渲染。可以提供一个加载中状态，告诉用户内容正在加载中。使用，实现路由级别的懒加载，优化应用的启动速度。可以处理组件加载过程中的各种状态，提升应用性能。可以等待数据加载完成之后，再进行组件的渲染。
2024-04-07 21:45:34
337
原创 vue3学习教程第十三节（组件之间传参通讯：props/$emit/$on/provide/inject/$attrs/$parent/pinia）父子传参、子向父传参
vue3项目中组件之间传参，事件触发：常用的六中方式：props 、$emit、$on、provide、inject、$attrs、$parent、pinia、defineExpose
2024-04-01 21:19:01
810
原创 vue3学习教程第十二节（组件的使用与类型）
vue2、vue3中组件的类型，以及组件的注意事项，特别是递归组件的使用，动态组件的用法，全局组件、局部组件各有自己的优点
2024-03-28 22:48:26
1148
3
原创 vue3学习教程第十一节（依赖注入：provide/inject父子传参）
vue 项目中，组件直接的通讯之依赖注入：provide/inject；全局依赖注入，父子祖孙之间通讯
2024-03-25 23:00:26
1002
原创 vue3学习教程第十节（插槽v-slot）父子传参
vue3 项目中 插槽使用，匿名插槽、具名插槽、作用域插槽（v-slot=“{text}”）插槽用法
2024-03-24 22:14:22
1066
原创 vue3学习教程第九节（新加指令 v-pre/v-once/v-memo/v-cloak ）
vue3中新添加指令如： v-pre/v-once/v-memo/v-cloak
2024-03-20 17:28:59
675
原创 vue3学习教程第八节（自定义指令 directive）
vue3 项目中自定义指令 directive，组件内自定义指令，全局自定义指令，防重指令
2024-03-19 21:27:23
546
原创 vue3学习教程第七节其他常用api
vue3项目中常用api、如：readonly()、isReadonly()、shallowReadonly()、isProxy()、toRaw()、markRaw()
2024-03-18 21:09:51
394
原创 vue3学习教程第六节（vue3 中 computed watch watchEffect）
vue 项目中 computed() 、watch() 、watchEffect()的使用以及注意事项
2024-03-15 21:49:18
592
原创 vue3学习教程第五节（reactive 及其相关）
vue3中响应式api的使用，以及注意事项 reactive()、 ref()、toRefs()、toRef()、isReactive()、 shallowReactive()使用
2024-03-13 22:05:22
718
2
原创 vue3学习教程第四节（ref以及ref相关api）
vue3 中ref以及ref相关内容，isRef 、unref、shallowRef、triggerRef、customRef
2024-03-12 22:07:25
998
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人