vuex state值更改但是getters 未更新

实现效果:选择一种交通工具则出现对应的席别列表。

state:

 seatList: {},//初始席别

最后state结果:

seatList: {
  '1':[{
  code:"101",
  name:'经济舱'
  },{
  code:"102",
  name:'公务舱'
  }],
  '2':[{
    code:"201",
    name:'商务座'
  },
  ...
  ]
},

getters:

seatListItem:(state)=>(key)=>{
    let list=state.common.seatList;
    return list[key]?list[key]:[]
  },

mutations:

SET_SEAT_LIST: (state,data) => {
      state.seatList = null;//问题出现在此处,对象要先置为null再赋值就可
      state.seatList= data;
    },

template:

<!-- 席别-->
          <el-select v-if="scope.row.vehicleCode&&seatListItem(scope.row.vehicleCode)" placeholder="" size="small"
                     class="selectWidth"
                     @change="handleChangeSeatType($event,scope.$index,receiptTableArr)"
                     v-model="scope.row.seatName"
                     :disabled="types == 'look'||!scope.row.vehicleCode"
                     v-bind:class="[types == 'look'?'numberStyleLocck':'','clearCursor']">
            <el-option
              v-for="(item,itenIndex) in seatListItem(scope.row.vehicleCode)"
              :label="item.value"
              :value="item"
              :key="itenIndex"
            ></el-option>
          </el-select>

computed:

computed: {
      ...mapState({
        vehicleList: state => state.vehicleList,//交通工具
        seatList: state => state.seatList,//席别
      }),
      ...mapGetters(['seatListItem'])
    },

methods:

getVehicleList(other){
      getVehicleSeatList({
        type:'JT',
        other 
      }).then((res)=>{
        if(res.data.code==200){
          const data = res.data.data;
          let seatList= this.$store.state.seatList;
              if(!seatList[other]){
                seatList[other]=data
              }
              this.$store.commit('SET_SEAT_LIST', seatList, params.other);
        } else {
          this.$message.warning('获取交通工具席别失败');
          return false
        }
      })
    },

最后发现,在mutations中要先将state设置为空然后再赋值,否则不更新。

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值