方法 "getChampionName" 在组件定义中具有类型 "undefined"。您是否正确引用了函数？

Question

我正在尝试使用此功能 (src/api/)

function getChampionName(champId) {
  axios.get('http://ddragon.leagueoflegends.com/cdn/12.5.1/data/en_US/champion.json')
    .then(({ data }) => {
      let list = data
      let championList = list.data
      for (var i in championList) {
        if (championList[i].key == champId) {
          return championList[i].id
        }
      }
    })
    .catch((err) => console.log(err))
}

export {getChampionName}

在此组件中 (src/components/)

<template>
  <div class="w-72">
    <header class="rounded-tl-lg rounded-tr-lg bg-slate-400 p-0.5">
      <p>Champion's Mastery</p>
    </header>
    <ul class="grid gap-1 rounded-bl-lg rounded-br-lg bg-slate-50 p-0.5">
      <li v-for="champ in masteryData.slice(0,10)" :key="champ.championId">
        <div class="flex items-center justify-between">
          <div class="flex items-center gap-2">
            <img src="https://ddragon.leagueoflegends.com/cdn/12.5.1/img/champion/Karma.png" alt="" class="rounded-lg h-14 w-14">
            <div>
              <p class="font-medium text-center">{{ getChampionName(champ.championId) }}</p>
              <p>Level {{ champ.championLevel }}</p>
            </div>
          </div>
          <p class="text-2xl font-medium">{{ champ.championPoints }} Pts</p>
        </div>
      </li>
    </ul>
  </div>
</template>

<script>
import getChampionName from '@/api/search'

export default{
  name: 'MasteryInfo',
  props: [
    'masteryData'
  ],
  methods: {
    getChampionName
  }
}
</script>

但是我收到这个错误 Method "getChampionName" has type "undefined" in the component definition. 并且不知道它是什么意思。

Answer 1

看来你没有正确导入方法。将导入更改为：

import { getChampionName } from '@/api/search';

您可以在 javascript 中阅读有关导入导出的更多信息： https://javascript.info/import-export

如果你觉得你和这个问题几乎有相同的问题，你也可以参考这个：

方法 "getChampionName" 在组件定义中具有类型 "undefined"。您是否正确引用了函数？

Method "getChampionName" has type "undefined" in the component definition. Did you reference the function correctly?

javascript

vue.js

vuejs2