如果你存在：

  1. 代码没报错，运行成功，但是index.js中router挂接的内容无法显示，
  2. 没有犯书写错误，routes 和 component 没有写错，
  3. 在浏览器中检查，App.vue中对应的 为空

那么建议你接着看，首先，正确的结果：

//App.vue中//关键是 router-view 能否成功渲染
If Element is successfully added to this project, you'll see an<code v-text="''">below
el-buttonexport default {name: 'app',components: {}}
//index.js文件import Vue from 'vue'import VueRouter from 'vue-router'import HomeView from '../views/main/HomeView.vue'import Layout from '../views/LayoutView.vue'Vue.use(VueRouter)//1.这里是routes，指定路径和成员 const routes = [{path: '/',name: 'Layout',//以下的 component（这是对的） 千万注意，不要写成 components（这是错的）component: Layout,children: [{path: '',name: 'Home',component: HomeView,meta: {isLogin: true}},{path: 'params',name: 'params',component: () => import('../views/main/ParamsView.vue'),meta: {isLogin: true}},{path: 'ad',name: 'ADclassify',component: () => import('../views/main/ADClassify.vue'),meta: {isLogin: true}},{path: 'product',name: 'product',component: () => import('../views/main/ProductView.vue'),meta: {isLogin: true}}]},{path: '/login',name: 'Login',component: () => import('../views/LoginView.vue'),meta: {isLogin: true}}]//2.这里是router,是一个VueRouter对象const router = new VueRouter({mode: 'history',base: process.env.BASE_URL,routes//3.这里是routes,对应1中指定的内容})export default router

以上，没什么问题的话，可以看到

App.vue中对应的 为是有值的

后来我导入在main.js中了一个js文件

//main.jsimport Vue from 'vue'import App from './App.vue'import router from './router'import store from './store'import './plugins/element.js'import './assets/css/common.css'//导入了这个文件，之后就看不见 router-view 渲染的内容了// import './router/permission.js'Vue.config.productionTip = falsenew Vue({router,store,render: h => h(App)}).$mount('#app')

这里，现在我还是不知道 permission.js 为什么会导致router-view不能渲染

//permission.jsimport router from './index'router.beforeEach((to, from, next) => {if (to.meta.isLogin) {const token = falseif (token) {next()} else {next({name: 'Login'})}} else {next()}})

总的来说：Vue中router-view无法显示可能是导入了什么不合适的文件导致