vue2项目，computed和watch带来的问题，该怎么解决？-灵析社区
爬虫爬呀爬场景是这样的，一张新建/编辑页，编辑页的数据是接口获取的。页面里的表单元素里有一些复杂的计算逻辑，请问： 1.计算逻辑是写在methods里，然后表单元素change或者input的时候调用它，还是直接写在computed里计算它？ 2.我一开始是这么写的，computed计算出需要的结果a,b,c,d（且这四个值又能通过表单元素被修改，如input）。然后watch监听a,b,c,d的变化，赋值给表单元素绑定的值。但是发现一个问题，在编辑页的时候，由于表单数据是接口获取的，在接口获取到后，computed会计算，从而watch监听到，此时假设a后端返回的值是人为修改后的数值1，但是实际被computed计算成了2，就导致页面展示数据是计算后的。这就有问题。该如何解决？ 3.如果写在change或者input里感觉就会比较恶心，需要考虑的情况复杂，尤其是涉及到多个值联动的情况。
生成头像1.尽量写computed，不用太考虑依赖值变动的情况
2、
更新：通过路由来区分是新增页面还是修改页面，计算属性是可以直接像变量一样用{{}}括起来展示的:
{{ pageTitle }}
变量1:
变量2:
变量3:
计算值: {{ computedValue }}
export default {
data() {
return {
var1: 0,
var2: 0,
var3: 0,
};
},
computed: {
computedValue() {
return this.var1 + this.var2 + this.var3;
},
pageTitle() {
return this.isEditMode ? '编辑页面' : '新增页面';
},
isEditMode() {
// 根据路由参数判断是否是编辑模式
return this.$route.params.editMode === 'edit';
},
},
created() {
if (this.isEditMode) {
// 在编辑模式下请求后端数据，然后更新表单字段
// 这里模拟一个异步请求
setTimeout(() => {
this.var1 = 10; // 假设从后端获取的数据
this.var2 = 20; // 假设从后端获取的数据
this.var3 = 30; // 假设从后端获取的数据
}, 1000);
}
},
};