uniapp不能直接修改props的数据原理浅析
uniapp不能直接修改props的数据
Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "expectDeliveryAt"
避免直接修改prop，因为每当父组件重新渲染时，该值都会被覆盖。相反，请根据data的值使用数据或计算属性。
产生原因:
在 Vue.js 中，一般不推荐在子组件中直接修改 props。这是由于 Vue 的响应式原理决定的。当你将一个对象作为 prop 传递给子组件，并在子组件中修改这个对象的属性，父组件并不能感知到这个修改。这是因为 Vue 只会关注对象属性的 getter 和 setter，当你在子组件中直接修改对象的属性，getter 和 setter 并没有触发，所以 Vue 无法感知到这个修改。
解决方法：
v-model指令或.sync修饰符- 将修改属性的方法通过
v-bind传给子组件调用，子组件直接按方法使用即可 - 将修改属性的方法通过
v-on传递给子组件调用，使用$emit()实现回调修改 - 或者使用
this.$parent去修改
实例：
props: ['params'],
watch: {
'params.approveStatus': function(newVal, oldVal) {
this.$emit('update:params', { approveStatus: newVal });
}
}<child-component :params="params" @update:params="updateParams"></child-component>
methods: {
updateParams(newParams) {
this.params = newParams;
}
}