this is main.js
import Vue from "vue"
import VueRouter from"vue-router";
import App from "./App"
import Routes from "./router"
Vue.use(VueRouter)
let router = new VueRouter({
Routes
})
new Vue({
router,
render:h=>h(App)
}).$mount("-sharpapp")this is App.vue
<template>
<div id="app">
<v-header></v-header>
<div class="tab">
<div class="tab-item">
<router-link to="/goods"></router-link>
</div>
<div class="tab-item">
<router-link to="/comment"></router-link>
</div>
<div class="tab-item">
<router-link to="/seller"></router-link>
</div>
</div>
<router-view></router-view>
<!-- -->
<!-- -->
</div>
</template>this is router/index.js
import Vue from "vue"
import Router from "vue-router"
import goods from "@/components/goods/goods"
import comment from "@/components/comment/comment"
Vue.use(Router)
export default new Router({
routes:[
{
path: "/comment",
name: "comment",
component:comment
},
{
path: "/goods",
name: "goods",
component: goods
}
]
})
this is the component
<template>
<div>I am goods</div>
</template>
<script type="text/script"></script>
<style lang="stylus" rel="stylesheet/stylus"></style>Why does the content of App.vue appear and the router-link click address of App.vue also jumps, but router-view cannot render the content in the component