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

Posted 2023-03-25

参考技术A 在用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