Vuex状态监听mapState与普通的局部计算属性混合使用

mapState如果和普通的局部计算属性混合使用,使用对象展开运算符(…)

data () {
  return {
    order: {
      orderId: '',
      amount: 0.0
    }
  }
},
computed: {
  amount () {
    return this.order.amount
  },
  ...mapState({
    order_create_watcher: state => state.order.order_create
    order_confirm_watcher: state => state.order.order_confirm
  })
},
watch: {
  amount: 'amountWatcher',
  order_create_watcher: {
    handler: 'orderCreateWatcher',
    deep: true
  },
  order_confirm_watcher: {
    handler: 'orderConfirmWatcher',
    deep: true
  }
},
methods: {
  amountWatcher (val, oldVal) {
    ...
  },
  orderCreateWatcher (val, oldVal) {
    ...
  },
  orderConfirmWatcher (val, oldVal) {
    ...
  }
}
上一篇 Vue对某个对象的属性进行watch监听
下一篇 Vuex Do not mutate vuex store state outside mutation handlers
目录
文章列表
1 RocketMQ之Producer
RocketMQ之Producer
2
Spring Cloud配置中心git示例
Spring Cloud配置中心git示例
3
Spring Cloud中Eureka Client启动后就关闭 Unregistering application xxx with eureka with status DOWN
Spring Cloud中Eureka Client启动后就关闭 Unregistering application xxx with eureka with status DOWN
4
Magento接入MongoDB
Magento接入MongoDB
5
Sharding-Sphere:Sharding-JDBC读写分离,Docker搭建MySQL主从
Sharding-Sphere:Sharding-JDBC读写分离,Docker搭建MySQL主从
最新评论
一位WordPress评论者
一位WordPress评论者
2月12日
您好,这是一条评论。若需要审核、编辑或删除评论,请访问仪表盘的评论界面。评论者头像来自 Gravatar。