这里我使用了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组件不存在的时候就不会报错,一点点的往下排查最终发现错误。

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐