Vue通过router-link或者button跳转到一个新的页面

a、商品列表页面如下（点击'跳转到购物车页面'就会跳到一个新的页面，而不是在同一个页面加载一个组件）







b、通过方法还需要修改路由文件src/router/index.js，其他方法不用看了

import Vue from 'vue'
import Router from 'vue-router'
import GoodsList from '@/views/GoodsList'
import Title from '@/views/Title'
import Image from '@/views/Image'
// 2、导入Cart组件
import Cart from '@/views/Cart'

Vue.use(Router)

export default new Router({
  mode: 'history',
  routes: [
    {
      	path: '/goods',
      	name: 'GoodsList',
      	component: GoodsList,
      	children: [
      		{
      	  		path: 'title',
          		name: 'title',
          		component:Title	
      		},

      		{
      	  		path: 'image',
          		name: 'image',
          		component:Image	
      		}
      	]
    },
    // 1、写入购物车组件
    {
    	path: '/cart',
      	component: Cart,
    }
  ]
})