刚接触vue,写路由是遇到点问题,没有报错但是也没有效果
index.html
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui">
<meta name="screen-orientation" content="portrait"/>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<meta name="full-screen" content="yes">
<meta name="x5-fullscreen" content="true">
<title></title>
</head>
<body>
<div id="app"></div>
<router-view></router-view>
<!-- built files will be auto injected -->
</body>
</html>
main.js
import Vue from 'vue'
import VueRouter from "vue-router"
// import routes from "./router/router"
import App from "./App"
import homePage from "./page/home/home"
import itemPage from "./page/item/item"
import scorePage from "./page/score/score"
Vue.config.productionTip = false
Vue.use(VueRouter)
const router=new VueRouter({
mode: 'history',
routes:[
{
path:"/",
component:App,
children:[{
path:"/home",
component:homePage
}, {
path: '/item',
component:itemPage
}, {
path: '/score',
component: scorePage
}]
}
]
})
new Vue({
el:"#app",
router,
})
App.vue
<template>
<div>
App Vue page..........
<router-view></router-view>
</div>
</template>
<script>
export default {
}
</script>
<style>
</style>
你把index.html里面的routerview去掉后试试?
然后main.js里面实例化vue的配置没有挂载组件,需要把App挂载进去