VUE中如何监听对象的属性变化

需要做两个选择器的级联操作,根据当前阶段显示不同的当前状态,我的第一思路是用到VUE的计算属性computed

computed:{
      statusOptions:function () {
        let me = this;
        let stage = project.currentStage;
        let url = "./svc/dict/project?currentStage=" + stage;
        me.$http.get(url).then(res => {
          return res.data.status;
        })
      }
    },

结果发现在project.currentStage值发生变化的时候,异步请求可以请求成功并返回options,但是statusOptions并不能取到这个值,百度了一下原因比较多的说法是computed是计算属性,需要根据计算马上获取到值,所以不能用异步请求。所以我又想到了用watch属性监听。

因为第一个选择器中的v-model绑定的peoject对象的currentStage属性,所以就直接监听的属性值,但是这样的写法是不允许的

 百度了一下怎么监听对象下的属性,最后的解决方法有两个:1.用computed做中间层 2.用' '把监听对象包起来,第二种比较简洁,于是就采取了第二种方式

watch: {
      'project.currentStage': function (val) {
        let me = this;
        let stage = val;
        let url = "./svc/dict/project?currentStage=" + stage;
        me.$http.get(url).then(res => {
          me.statusOptions = res.data.status;
        })
      }
    },

然后测试一下果然可以了

  • 0
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值