ElementPlus的Table中的formatter报Cannot read properties of undefined (reading ‘__asyncLoader‘)

这里我使用了el-menu的router模式切换时出现的问题。

先看一个极简示例：

<template>
  <el-table :data="exchanges" title="管理" stripe>
    <el-table-column prop="level" label="等级" :formatter="formatter" />
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      exchanges: [{level: 3}]
    }
  },
  methods: {
    formatter(row) {
      return row
    }
  },
}
</script>

<style lang="scss" scoped>
</style>

问题正是出在formatter方法原样返回了row，formatter如果返回了一个对象，哪怕是最简单的{}也会出现这个错误：

runtime-core.esm-bundler.js:2247 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading '__asyncLoader')
    at isAsyncWrapper (runtime-core.esm-bundler.js:2247:1)
    ...

解决方法就是不返回对象类型的数据，比如我这里可以改成：

formatter(row) {
  return row.level
}

这个错误很罕见，多方搜索只搜到了一篇有关文章，但这篇文章却严重诱导了我的排错方向，花了近一天的时间来排查错误，才在最后发现当el-table组件不存在的时候就不会报错，一点点的往下排查最终发现错误。