vue this.$forceUpdate() 强制刷新页面数据

1.遇到问题：在项目中我们用dialog做了一个通用组件，在组件中有一个el-table，当获取数据后el-table数据并未进行数据的重新渲染，我尝试用v-if去重新加载，但是这样会有其他数据跟随重新变化的Bug。2.在此情况下，在el-table数据重新获取后使用this.$forceUpdate()进行强制刷新即可解决。3.其他使用场景，像v-for的children渲染、多层数据渲染、页面

巴布洛克的盾

3773人浏览 · 2021-12-15 09:36:08

巴布洛克的盾 · 2021-12-15 09:36:08 发布

1.遇到问题：在项目中我们用dialog做了一个通用组件，在组件中有一个el-table，当获取数据后el-table数据并未进行数据的重新渲染，我尝试用v-if去重新加载，但是这样会有其他数据跟随重新变化的Bug。

2.在此情况下，在el-table数据重新获取后使用this.$forceUpdate()进行强制刷新即可解决。

3.其他使用场景，像v-for的children渲染、多层数据渲染、页面数据与this数据不一致等，可在获取数据后使用this.$forceUpdate()页面刷新数据。

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^