菜鸟需勤奋

摘要： readonly: 让一个响应式数据变为只读的（深只读）。 shallowReadonly：让一个响应式数据变为只读的（浅只读）。 应用场景: 不希望数据被修改时。 阅读全文

摘要： shallowReactive：只处理对象最外层属性的响应式（浅响应式）。 shallowRef：只处理基本数据类型的响应式, 不进行对象的响应式处理。 什么时候使用? 如果有一个对象数据，结构比较深, 但变化时只是外层属性变化 > shallowReactive。 如果有一个对象数据，后续功能不会 阅读全文

摘要： toRef 作用：创建一个 ref 对象，其value值指向另一个对象中的某个属性。 语法：const name = toRef(person,'name') 应用: 要将响应式对象中的某个属性单独提供给外部使用时。 扩展：toRefs 与toRef功能一致，但可以批量创建多个 ref 对象，语法： 阅读全文

摘要： 什么是hook？—— 本质是一个函数，把setup函数中使用的Composition API进行了封装。 类似于vue2.x中的mixin。 自定义hook的优势: 复用代码, 让setup中的逻辑更清楚易懂。 创建hook3文件夹 新建usePoint.js文件（文件名以userxxx命名） ap 阅读全文

摘要： watch的套路是：既要指明监视的属性，也要指明监视的回调。 watchEffect的套路是：不用指明监视哪个属性，监视的回调中用到哪个属性，那就监视哪个属性。 watchEffect有点像computed： 但computed注重的计算出来的值（回调函数的返回值），所以必须要写返回值。 而watc 阅读全文

摘要： 与Vue2.x中watch配置功能一致 两个小“坑”： 监视reactive定义的响应式数据时：oldValue无法正确获取、强制开启了深度监视（deep配置失效）。 监视reactive定义的响应式数据中某个属性时：deep配置有效。 //情况一：监视ref定义的响应式数据 watch(sum,( 阅读全文

摘要： <template> <!-- vue3组件中的模板结构可以没有根标签 --> <h1>一个人的信息</h1> 姓：<input type="text" v-model="person.firstName"><br> 名：<input type="text" v-model="person.last 阅读全文

摘要： 作用: 定义一个对象类型的响应式数据（基本类型不要用它，要用ref函数） 语法：const 代理对象= reactive(源对象)接收一个对象（或数组），返回一个代理对象（Proxy的实例对象，简称proxy对象） reactive定义的响应式数据是“深层次的”。 内部基于 ES6 的 Proxy 阅读全文

摘要： 作用: 定义一个响应式的数据 语法: const xxx = ref(initValue) 创建一个包含响应式数据的引用对象（reference对象，简称ref对象）。 JS中操作数据： xxx.value 模板中读取数据: 不需要.value，直接：<div>{{xxx}}</div> 备注： 接 阅读全文

摘要： 理解：Vue3.0中一个新的配置项，值为一个函数。 setup是所有Composition API（组合API）“ 表演的舞台 ”。 组件中所用到的：数据、方法等等，均要配置在setup中。 setup函数的两种返回值： 若返回一个对象，则对象中的属性、方法, 在模板中均可以直接使用。（重点关注！） 阅读全文