vuex的dom更新回调问题

为君一笑 提交于 2019-12-27 10:56:20

https://segmentfault.com/q/1010000007359564

 

根据vue的响应式原理,多次的数据操作之后进行一次的dom更新,所以可以使用$nextTick在dom更新后做些什么。

但是今天我使用了vuex来管理应用状态,我在组件中发了一个dispatch来触发某个action,action又触发mutations来改变状态,但是在vuex中没有nextTick这个东西,我无法在dom更新后做些什么

在组件写的nextTick也不是在vuex更新状态后触发的,而是在组件自身的dom更新后触发,现在也想不出个办法,求各位大神帮帮忙

this.$store.dispatch("action",{
    name: "test",
    type: "add"
});
this.$nextTick(() => {
    //vuex改变状态后的dom还没有更新就执行到这里了
    $(".slimscroll-render").eq(index).slimScroll();
    $.fn.fullpage.setAllowScrolling(false);
});
 

1个回答

1

我也遇到这个问题了,由于后台请求是异步的,所以$.nextTick 并不能正确更新, 我最后的解决办法是通过watch 来实现的,

 
watch: {
      itemList: function (val, oldVal) {
        console.log(val)
        console.log(oldVal)

        this.$nextTick(() => {
          const ms = this.$refs.grid.masonry
          ms.reloadItems()
          ms.layout()
        })
      }
    }
标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!