undefinedfix
Sign in

Vue computd watch problem

Seba99 edited in Fri, 25 Nov 2022

For example, an interface depends on a, B, C, D... And other parameters. As long as one of the parameters changes, the interface needs to be called. The post-processing results returned by the interface need to be processed separately according to the parameter names of a, B, C, D. the following is the method I think of. The problem is that I can't get the changed attribute names. Is there a better solution

//伪代码
computed:{
    params(){
      return {
          a:a,
          b:b,
          c:c,
          d:d,
          ... 
      }
    }
},
watch:{
    'params':{
        deep:true,
        handler(newValue,oldValue){
            let param=newValue;
            1, 调用接口 参数 param
            2,(重点) 返回结果 根据a,b,c,d 等属性名分别处理
            //方法1:
            //如果在这里能获取到属性名 a , b,c  可以解决
            //问题是,这里不知道怎么获取变化的属性名           

        }
    }
}
3 Replies
Emanuele
commented on Fri, 25 Nov 2022

The calculated attributes in Vue are usually the combined response data, while the observed attributes are used to process the updated attributes. In other words, the property you observe must be indirectly dependent on the response property, that is, the data object returned by the data method.

Jinja_dude
commented on Sat, 26 Nov 2022
  1. If the parameters are controlled by the form, I recommend that you listen for the change event of the form element
  2. If the parameter is passed in by the parent element, use watch
  3. Anyway, you have to request again. It doesn't matter which attribute has changed
filips
commented on Sat, 26 Nov 2022

When params changes, you can cache its snapshot.

this.paramsSnapshot = JSON.stringify(this.params);

And then which one to compare