Vue.js 中 <el-table-column> 报错 'v-if/else branches must use unique keys' 的解决方法

报错提示是因为 v-if 和 v-else 使用了相同的 key，而 Vue 要求 v-if 和 v-else 的分支应该使用唯一的 key。

你可以尝试将 v-if 和 v-else 的分支使用不同的 key 来解决这个问题。例如，你可以使用一个动态的 key，以确保唯一性。示例代码如下：

<template>
  <el-table :data='tableData' border stripe :height='height' @row-click='handleRowClick'>
    <!-- v-for 循环取表头数据 -->
    <template v-for='item in tableHeader'>
      <table-column v-if='item.children && item.children.length' :key=''column-' + item.id' :column-header='item' />
      <el-table-column v-else :key=''table-column-' + item.id' :label='item.label' :prop='item.prop' align='center' />
    </template>
  </el-table>
</template>

在上面的代码中，我使用了一个动态的 key，通过在 key 中添加前缀来确保唯一性。例如，对于 v-if 的分支，我添加了 'column-' 前缀，而对于 v-else 的分支，我添加了 'table-column-' 前缀。

这样做可以解决报错问题。希望能帮到你！