vue.js がコンポーネントを循環参照してエラーを報告する場合の対処方法

循環参照コンポーネントのエラーを解決するための Vue.js メソッド: まずプロジェクトを開いてグローバル インポート コンポーネントを使用します。次に、vue がインスタンス化される前にそれを [main.js] に導入します。コードは [import selFile] です。 「./views/file/selFile.vue」から]。

【おすすめ関連記事: vue.js】

vue.js は、ループ コンポーネントを引用してエラーを報告する方法:

問題の原因

最近、プロジェクトで作業しているときにループ コンポーネントの使用に遭遇しました。モデルは同じですが、データが異なるだけです。通常のコンポーネント呼び出し形式に従って実行すると、常にエラーが報告されます。エラー メッセージは [Vue warn]: Unknown Custom element: 8b192274ffe2a51bf4700f03fc413189 - コンポーネントを正しく登録しましたか? 再帰コンポーネントの場合は、必ず提供してください。 "name" オプション。

解決策

インターネットでさまざまな情報を確認したところ、コンポーネントを周期的に呼び出すと、vue インスタンスの後にコンポーネントが作成されることがわかりました。 . 公式ドキュメントではコンポーネントを先に書く必要があります インスタンス化によって導入されるため、コンポーネントが正しく導入されません。

解決策

解決策は、vue がインスタンス化される前にコンポーネントをグローバルに導入することです。

特に私たちのプロジェクトでは、main.js で導入されています。

具体的なコードは次のとおりです main.js:

import Vue from 'vue'
import App from './App'
import router from './router'
import store from './store';
import iView from 'iview';
import './styles/index.less'
import {VTable,VPagination} from 'vue-easytable'
import 'vue-easytable/libs/themes-base/index.css'
import Axios from './utils/axiosPlugin'
import './styles/button.css'
import './styles/common.css'
// require('./mock/mock')
import selFile from './views/file/selFile.vue'
 
Vue.use(iView);
Vue.use(Axios);
 
Vue.component(VTable.name, VTable)
Vue.component(VPagination.name, VPagination)
Vue.component("selFile",selFile)
 
Vue.config.productionTip = false
 
/* eslint-disable no-new */
new Vue({
 el: '#app',
 store,
 router,
 components: { App },
 template: &#39;<App/>&#39;
})

上記の方法を使用してコンポーネントをグローバルに導入すると、循環参照コンポーネントで報告されるエラーの問題を解決できます。

関連する無料学習の推奨事項: javascript (ビデオ)

以上がvue.js がコンポーネントを循環参照してエラーを報告する場合の対処方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。