element 一个页面两个table显隐相互影响

在用element UI 做项目时，发现如果一个页面有两个table时，并且这两个table会有一个显示一个隐藏的功能（v-if，v-else）时，会出现表格错落的情况，两个table会相互影响。经过查询VUE官网发现：

  Vue 会尽可能高效地渲染元素，通常会复用已有元素而不是从头开始渲染。

所以我们可以给el-table元素加上key值标识，不许复用。

<el-table :data="tableData" key="one" border>

          <el-table-column prop="index" label="#" width="100" align="center">

          </el-table-column>

          <el-table-column prop="month" label="月份" align="center">

          </el-table-column>

          <el-table-column prop="amount" label="费用/万" align="center">

          </el-table-column>

        </el-table>

原文链接：https://blog.csdn.net/weixin_43829719/article/details/119203723

©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容