vue子组件数据不刷新,vue刷新页面时只让部分组件刷新
本文主要介绍vue组件值变化但不刷新时强制组件刷新的问题。有很好的参考价值，希望对大家有所帮助。如有错误或不足之处，请不吝赐教。
目录
元件值更改但不刷新。强制组件刷新。bug重现解决方案。强制组件刷新。问题解决方案强制组件刷新
组件值变化但不刷新强制组件刷新
调用组件时，如果数据中只有某个属性(如id)发生变化，vue开发工具中的变量值会发生变化，但组件上的数据不会刷新。
bug复现
参考组件
bulletMenuVue v-else-if= s node . type== cBomb :data= s node /
SNode数据结构
{
id : gunm2c 4 ，
标签:项目符号4 ，
键入: cBomb ，
数据:{
角度:50，
mwr :
checked: false，
乐队:50，
dbi: 50
},
单反:
checked: false，
长度:50，
功率:50，
光斑:50，
尺寸：50
},
红外探测器:
checked: false，
乐队:50，
dbi: 50
},
mwd :
checked: false，
乐队:50，
方向:50，
角度:50
}
}
}
当鼠标点击切换项目符号太快时，子组件不会被刷新。
解决
先看看值是不是return！没有return，子组件没有响应，watchEffect甚至不能监听。
我们将提供一个关键属性，以便Vue知道特定的组件与特定的数据相关联。如果键保持不变，组件就不会改变，但是如果键改变了，Vue就会知道应该删除旧的组件，创建一个新的组件。
我们可以给一个子组件分配一个键，当我们想要重新渲染组件时，我们可以只更新键。这应该是强制Vue重新渲染组件的最好方法。
具体一点
将项目符号id作为组件的键。当密钥id改变时，Vue将知道它必须销毁组件并创建一个新的组件。我们得到的是一个子组件，它将重新初始化自己并“重置”其状态。
bulletMenuVue v-else-if= s node . type== cBomb :data= s node :key= s node . id /
强制刷新vue组件
例如，我有一个表格。每次我点击其中一行，就会弹出一个窗口显示相应的信息。弹出窗口如下
El-dialog:title= text map[dialog status]:visible . sync= dialogFormVisible top= 0
user page v-if= isShow :userid= userid /
/el-dialog
可以看到，弹出窗口中加载的其实是一个组件，通过判断当前点击行的id来呈现不同的数据。
问题
发现其实每个弹出窗口的数据都是第一次加载的数据，因为根本没有重新加载，只是显示和隐藏了dialog中的组件。
解决 强制刷新组件
将强制刷新组件的代码添加到点击时间中，如下所示
//方法中的方法
handleCreate(row) {
This.isShow=false//销毁组件
这个。$nextTick(()={
This.isShow=true//重新构建组件
})
//控制对话框的显示
this.dialogStatus=create
this.dialogFormVisible=true
//传递参数
this . userid=row . approval id . tostring()
}
以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。