vuejs小项目——vuejs2.0版本单页面搭建

Posted 2020-08-23

http://router.vuejs.org/zh-cn/essentials/nested-routes.html

使用嵌套路由开发，这里会出错主要把Vue.use(VueRouter);要进行引用

main.js

import Vue from ‘vue‘;
import VueRouter from ‘vue-router‘;
Vue.use(VueRouter);

import App from ‘./App‘;
import goods from ‘./components/goods/goods‘;
import ratings from ‘./components/ratings/ratings‘;
import seller from ‘./components/seller/seller‘;


const router = new VueRouter({
    routes:[
        {
            path:‘‘,component:App,
            children: [
                {
                    path:‘‘,
                    component:goods
                },
                {
                    path:‘goods‘,
                    component:goods
                },
                {
                    path:‘ratings‘,
                    component:ratings
                },
                {
                    path:‘seller‘,
                    component:seller
                }
            ]
        }
    ]
})

const app = new Vue({
    router
}).$mount(‘#app‘);

 使用router.go(‘/goods‘)会造成页面不断刷新

2.0版本下使用router.push(‘/goods‘);