记一次nextTick的使用方法

众所周知 nextTick是在下次数据变化DOM渲染完成后执行

关键词:element table 数据变了不刷新视图 vue

先写解决原理 谷歌浏览器此版本bug让数据刷新出现了沉诟 那我分两次走饿了吗就更新的过来了 先清空数据 刷新页面 再赋值数据 刷新页面

写项目 element老是跟我对着干 数据更新了 表格会有遗留 刷新不及时,以前也是同样方法写筛选器也没遇到过

reload(){
      this.shopItem =arr //简单一行赋值改变数据
}

这就恶心到我了,排错 排错 以为是我筛选器些错了? 或者版本不行? 或者不能这么用?vue.$set?
都改了 全试了 还不行 懂了 就是一个bug
咋解决呢 迷糊了一会 看了下我的显示数据 的确赋值了 而且下拉栏的长度也有变化 也就是说bug出在 element的刷新上
那我试试在赋值前 先清空数据刷新会不会正常
卧槽 不行
额 想法应该可以 是不是vue机制 本次线程未完成不执行刷新视图 诶...! 可以用nextTick
破处了 第一次用这个函数 之前一直没遇到过

this.shopItem.splice(0) //先清空数据 防一手defineProperty搞我 用了splice
this.$nextTick(() => {
       this.shopItem =arr
     })

成了 就是一个不知是浏览器还是vue elment的自身bug(已经确认是浏览器) 这个数据不刷新可把我气坏了 终于杀青了 好在老天不付有心人 好事多磨 没白花我一个多小时
之后切换浏览器尝试此bug 确认是浏览器问题 虽然Edgo也是谷歌的核心 但是没有此bug

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容