[解決済み] コンポーネントを正しく登録しましたか？再帰的なコンポーネントの場合は、必ず "name "オプションを指定してください。

質問

私が設定した 'i-tab-pane': Tabpane を設定しましたが，エラーとなりました．

<template>
  <div class="page-common">
    <i-tabs>
      <i-tab-pane label="wx">
        content
      </i-tab-pane>
    </i-tabs>
  </div>
</template>

<script>

  import {
    Tabs,
    Tabpane
  } from 'iview'

  export default{
    name:"data-center",
    data(){
      return {msg: 'hello vue'}
    },
    components: {
      'i-tabs' : Tabs,
      'i-tab-pane': Tabpane
    }
  }
</script>

エラートレースバック

[Vue warn]: Unknown custom element: <i-tab-pane> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

found in

---> <DataCenter> at src/views/dc/data-center.vue
       <Index> at src/views/index.vue
         <App> at src/app.vue

で試してみましたが main.js をグローバル設定に変更してみました。

Vue.component("Tabpane", Tabpane);

を追加しましたが、まだ動作しません。 この問題を解決するにはどうしたらよいでしょうか。

どのように解決するのですか？

コンポーネントに異なる名前を付けているためです。

components: {
      'i-tabs' : Tabs,
      'i-tab-pane': Tabpane
    }

また、エクスポート時に同じ名前にする必要があります。(タブペインコンポーネントの名前にチェック)

name: 'Tabpane'

このエラーから言えることは、あなたが定義していない name をコンポーネントで定義していないことです。 Tabpane . を確認してください。 name を確認すれば、エラーにならずにうまくいくはずです。