Vue 3にグローバルコンポーネントを登録する

4761 ワード
vue javascript テキストリンク
更新:現在official guideです.
Vue 2ドキュメントには、自動的にベースコンポーネントを登録するために大きなwayがあります.
幸いにも、これはVue 3で最小の変化で働き続けます.

始める
Vue CLIとVUE 3を使用してプロジェクトを開始するとすぐに、main.jsファイルでこのようなものが表示されます.
createApp(App).mount('#app')
ベースコンポーネントを追加するには少し変更しましょう.
const app = createApp(App)

app.mount('#app')
我々は我々の登録を追加するアプリをマウントする前に.
ここでは、componentsフォルダ内のすべてのコンポーネントが必要です.
const requireComponent = require.context(
  './components',
  true,
  /Base[A-Z]\w+.(vue|js)$/
)
コンポーネントのfoldersおよびindex.vueファイルを好む場合は、正規表現を変更する必要があります.
/Base[A-Z]\w+\/index.vue$/
最後に、すべてのコンポーネントを反復処理する必要があります.
requireComponent.keys().forEach(fileName => {
  const componentConfig = requireComponent(fileName)

  const componentName = upperFirst(
    camelCase(
      fileName
        .split('/')
        .pop()
        .replace(/\.\w+$/, '')
    )
  )

  app.component(
    componentName,
    componentConfig.default || componentConfig
  )
})

これが本当の人生?
現実の実現を示すためにdemo appがあります.
白駿(10926、18108、10430、2588)号Pythonアルゴリズム問題
Macアップグレードnodeとnpm