在Vue中遇到一个问题，当两个按钮在同一位置通过v-if切换显示时，如果隐藏的按钮被禁用，即使显示的按钮也应该可用，但它也被禁用了。原因是Vue的元素复用策略。为了解决这个问题，可以给每个按钮添加一个唯一的key属性，这样每次状态切换时，Vue会认为是全新的元素，从而避免复用。这是一个关于Vue渲染优化和组件状态管理的常见问题。
情景：两个按钮位于页面同一个位置，通过v-if判断按钮的显隐，当隐藏的按钮被禁用时，另一个显示的按钮也被禁用了
原因：
“Vue 会尽可能高效地渲染元素，通常会复用已有元素而不是从头开始渲染。”---这是vue官网给出的解释。意思就是同一位置的的两个动态渲染的按钮，每次切换显隐的时候只是修改了按钮的文字，而按钮的内部属性并没有改变，这就导致了上面的问题。所以我们需要让两个按钮每次切换显隐的时候重新渲染，避免复用。因此只需添加一个具有唯一值的 key 属性即可
解决方法：
给按钮加上唯一的key属性
扫一扫
530
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
