vue监听数组中某个属性，计算其他属性问题

 

今天在项目开发中遇到一个根据数组中某个属性变化同时更新另一个属性变化的问题，刚开始代码如下

this.weekList1=r.data.roomProducts; 

this.weekList1.map(item=>{
  item.cus_price='';
  item.cus_plaPrice='';
  item.cus_addPrice='';
});

watch:{

weekList1:{

handler:function(newVal,oldval){
  let self=this;
    newVal.map(item=>{
          if(this.hotelPriceRules.type=='0'){

            item.cus_plaPrice=Number(item.cus_price)+Number((Math.ceil(self.hotelPriceRules.val)/100))*Number(item.cus_price);
            item.cus_addPrice=Number(item.cus_plaPrice)- Number(item.cus_price)
          }else if(this.hotelPriceRules.type=='1'){
            var jianGeDate='';
            var startTime=item.cus_time.split(',')[0];
            var endTime=item.cus_time.split(',')[1];
            jianGeDate=this.getDateDiff(startTime,endTime);
            item.cus_plaPrice=Number(item.cus_price)+Number(jianGeDate)*Number(this.hotelPriceRules.val);
            item.cus_addPrice=Number(item.cus_plaPrice)-Number(item.cus_price)
          }
        })
    },
    deep:true
  },
},



当你输入item.cus_price时监听的数组 watch weekList1方法并没有执行，因为在cus_price并没有加入到监听中，所以最简单的解决办法先整合好要监听的数组，再赋值

r.data.roomProducts.map(item=>{
  item.cus_price='';
  item.cus_plaPrice='';
  item.cus_addPrice='';

});

this.weekList1=r.data.roomProducts;

转载于:https://www.cnblogs.com/hongsusu/p/8966196.html