VUE 监控 VUEX 中的状态

背景:在一个项目中,需要获取 侧边栏展开/收缩 的状态,(侧边栏展开/收缩的状态已经存到 vuex中)来 resize图表( v-charts)。

方法:

computed: {
    getAsideCollapse() {        //获取并返回侧边栏状态
      return this.$store.state.d2admin.menu.asideCollapse;
    }
  },
  watch: {
    getAsideCollapse: {        //监控侧边栏状态
      handler(val) {        //立即执行监控
        if (!this.timer) {
          this.timer = true;
          let that = this;
          setTimeout(function() {        //避免因为组件异步加载导致的resize方法不起作用,设置定时器
            that.chartResize();        //图表resize方法
            that.timer = false;
          }, 400);
        }
      },
      immediate: true        //立即执行监控
    }
},
methods: {    chartResize() {      this.$nextTick(_ => {        this.$refs["chartPie"].echarts.resize();        this.$refs["chartLineBar"].echarts.resize();      });    }
}复制代码























转载于:https://juejin.im/post/5cad93ccf265da038260fe63

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值