加入路由功能后,无法渲染出Todo页面。
来源:4-2 Vue-router之配置

qq_d超_0
2018-07-19
我按照老师的视频,进行到再app.vue中加入<router-view />标签,但是在地址栏中,只能渲染出头和底部,中间部分缺失掉。输入/login也无法渲染出login的页面。浏览器没有报任何错误。希望老师给点调试的提示。
6回答
-
routes.js 里面的component: Todo,component改成小写试试?
112018-07-19 -
qq_d超_0
提问者
2018-07-19
import Todo from '../views/todo/todo.vue'
import Login from '../views/login/login.vue'
export default [
{
path: '/',
redirect: '/app'
},
{
path: '/app',
Component: Todo
},
{
path: '/login',
Component: Login
}
]
00 -
qq_d超_0
提问者
2018-07-19
import Router from 'vue-router'
import routes from './routes'
export default () => {
return new Router({
routes,
mode: 'history'
})
}
00 -
qq_d超_0
提问者
2018-07-19
import Vue from 'vue'
import VueRouter from 'vue-router'
import App from './app.vue'
import './assets/images/bg.jpeg'
import './assets/styles/global.styl'
import createRouter from './config/router'
Vue.use(VueRouter)
const router = createRouter()
new Vue({
router,
render: (h) => h(App)
}).$mount('#root')
00 -
qq_d超_0
提问者
2018-07-19
<template>
<div id="text">
<div id="cover">
<Header></Header>
<!-- <todo></todo> -->
<router-view />
<Footer></Footer>
</div>
</div>
</template>
<script>
import Header from './layout/header.vue'
import Footer from './layout/footer.jsx'
import Todo from './views/todo/todo.vue'
export default {
components: {
Header,
Footer,
Todo
}
}
</script>
<style lang="stylus" scoped>
#app{
position absolute
left 0
right 0
top 0
bottom 0
}
#cover{
position absolute
left 0
top 0
right 0
bottom 0
background-color #999
opacity .9
z-index 0
}
</style>
00 -
Marianax
2018-07-19
能否发下相关代码看下?
022018-07-19
相似问题