如何在vue-router中注册全局组件

JavaScript

村村达蒙LEY

2020-03-13

我在vue-cli中使用Vue.js。我选择了webpack设置。尽管找不到全局注册组件的方法,但我连接了main.js文件以进行路由。

main.js

import Vue from 'vue'
import VueRouter from 'vue-router'
import App from './App'
import Companies from './components/pages/Companies'
import Income from './components/pages/Income'
import Login from './components/pages/Login'

Vue.use(VueRouter)

let router = new VueRouter()

router.map({
  '/companies': {
    component: Companies
  },
  '/income': {
    component: Income
  },
  'login': {
    component: Login
  }
})

router.start(App, 'body')

应用程序

<template>
  <div>
    <router-view></router-view>
  </div>
</template>
<script>
import {Auth} from './lib/api'
import Loader from './components/Loader'

export default {
  components: {
    Loader
  },
  ready () {
    Auth.isLoggedIn().then(
      (response) => {
        if (response.data === false) {
          this.$router.go('/login')
        } else {
          this.$router.go('/companies')
        }
      },
      (response) => {
        this.$router.go('/login')
      }
    )
  }
}
</script>

在某些视图中使用Loader组件时,收到以下警告。

[Vue警告]:未知的自定义元素:-您是否正确注册了组件?对于递归组件,请确保提供“名称”选项。

我在组件中提供了名称,但没有任何区别。我在登录视图中使用了loader-component。
我发现我应该在要使用的组件中定义该组件,或者在全局范围内定义它。但是,我无法找到如何通过路由全局定义它。

第1471篇《如何在vue-router中注册全局组件》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

0个回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android