vue-router访问默认组件

Question

使用vue-router设置默认访问组件，组件内容不显示的问题代码设置默认组件访问路径，但是浏览器界面不显示的问题相关代码在router文件夹下创建两个js文件，一个router.js,一个index.js,首先router.js代码如下：export const loginRouter = {path: '/',name: 'login',title: '登录',meta: {index: 0},component: ()=> import('@/components/login.vue')};export const routers =[loginRouter,]index.js代码如下：import Vue from 'vue'import VueRouter from 'vue-router'import {routers} from './router'Vue.use(VueRouter);const RouterConfig = {mode: 'history',routers: routers}export const router = new VueRouter(RouterConfig);然后main.js的代码如下：import Vue from 'vue'import App from './App'import {router} from './router/index';import iView from 'iview';Vue.use(iView);Vue.config.productionTip = false;new Vue({el: '#app',router: router,render: h => h(App)})你期待的结果是什么？实际看到的错误信息又是什么？login.vue的相关代码：<div class="login"><h1>登录</h1></div>期望可以看到在login.vue实现的界面样式，目前界面是空，什么都不显示，请问是什么原因导致的这个问题？

Answer 1

你的App.vue组件有router-view吗