vue3对象里面的数组push数据,数据失去响应,应该如何使数据保持响应式呢?-灵析社区

满脑子智慧溢出

const addData = ref({ recordName: "", appointmentStartTime: "", appointmentEndTime: "", departurePlace: "", arrivalPlace: "", vehicleId: "", vehicleNumber: "", driverId: "", nickName: "", recordStatus: "", reason: "", taskRemark: "", approachPointNum: "", simultaneous: "", approachPointList: [ { startPoint: "", endPoint: "", approachStatus: "", approachEndStatus: "", delFlag: "", approachStartComment: "", approachEndComment: "", approachStartTime: "", approachEndTime: "", rider: "", approachReason: "", approachCost: "", approachDepartureMiles: "", approachArrivalMiles: "", approachPointOrder: "", expenseLedgerList: [ { expenseType: "", expenseAmount: "", picture: "", }, ], clockList: [ { appointmentPoint: "", time: "", point: "", status: "", }, { appointmentPoint: null, time: "", point: "", status: "", }, ], }, ], }); 往approachPointList里面加数据失去响应式 const addclick = () => { addData.value.approachPointList.push({ startPoint: "", endPoint: "", approachStatus: "", approachEndStatus: "", delFlag: "", approachStartComment: "", approachEndComment: "", approachStartTime: "", approachEndTime: "", rider: "", approachReason: "", approachCost: "", approachDepartureMiles: "", approachArrivalMiles: "", approachPointOrder: "", expenseLedgerList: [ { expenseType: "", expenseAmount: "", picture: "", }, ], clockList: [ { appointmentPoint: "", time: "", point: "", status: "", }, { appointmentPoint: "", time: "", point: "", status: "", }, ], });

阅读量:18

点赞量:0

问AI
// 定义响应式数据 // 可以持有任何类型的值, // 函数接收默认值,返回带有 .value 的对象 // 只有顶级 ref 属性才能被解包 // const { id } = { id: ref(1) },其中 id 依然返回 ref 对象 const count = ref(0); // 定义响应式数据 // 绑定变量的数据类型 Object, Array,Map, Set, // 函数接收默认值,返回原数据的 Proxy // PS: 输出到模板使用时需要 toRefs 重新编译 // PS:解构操作,或者函数赋值,会直接丢失响应性链接 // PS:{ id } = reactive({ id: 1}),其中 id 是非响应式的 const state = reactive({ count: 0 }) 简单地说 ref 定义响应式的 String, Number, Boolean reactive 定义响应式的 Object, Array,Map, Set