2024 年 10月 20 日随笔档案 - joken1310

vue3 修改原对象，赋值原对象的ref或者reactive如何产生响应式视图变更，vue失去响应式的原因

摘要：代码测试 <template> <div class='box'> {{ demo[0]?.a?.b?.c }} </div> </template> <script lang='ts' setup> import { ref, reactive, computed, onMounted, next 阅读全文

posted @ 2024-10-20 22:50 joken1310 阅读(410) 评论(0) 推荐(0)

vue3 ref 或者reactive被赋值其他对象数据，用的是同一块内存，而不是深拷贝。修改原对象，ref不能响应式的原因

摘要：代码测试源对象改变也会改变ref内存数据 <template> <div class='box'> {{ abcDemo?.a?.b?.c }} <button @click="changeAbc">Change ABC</button> <div> {{ abdDemo?.a?.b?.c }} 阅读全文

posted @ 2024-10-20 21:25 joken1310 阅读(389) 评论(0) 推荐(0)

vue3 修改数组索引方式修改数组内容能不能响应式测试

摘要： <template> <div class='box'> {{ abc[0] }} </div> </template> <script lang='ts' setup> import { ref, reactive, computed, onMounted, nextTick, PropType 阅读全文

posted @ 2024-10-20 20:59 joken1310 阅读(77) 评论(0) 推荐(0)

vue3.5 测试props解构能不能响应式

摘要：代码测试 <template> <div class='box'> demo:{{ d }} <div> <child :abc='abc' /> </div> </div> </template> <script lang='ts' setup> import { ref, reactive, c 阅读全文

posted @ 2024-10-20 20:47 joken1310 阅读(53) 评论(0) 推荐(0)

vue3 深度响应式是否正常测试，以select options作为例子测试，select options后赋值是否不能正常显示选中的label

摘要： <template> <div class='box'> <template v-for="(ditem, dindex) in data1" :key="dindex"> <el-select v-model="ditem.value" clearable filterable> <el-opti 阅读全文

posted @ 2024-10-20 20:29 joken1310 阅读(33) 评论(0) 推荐(0)

joken-前端工程师