Vue-router 教學 - iT 邦幫忙 | vue-router教學
一、基本設置src/router/index.jsimportVuefromvueimportRouterfromvue-routerimportOrderfrom"@/components/Order";Vue.use(Router)exportdefaultnewRouter({routes:[{path:/order,component:Order}]})src/App.vue
src/router/index.js
import Vue from vue import Router from vue-router import Order from "@/components/Order"; Vue.use(Router) export default new Router({ routes: [ { path: /order, component: Order } ] })src/App.vue
<template> <div id="app"> <router-view/> </div> </template>http://www.網址/#/order[1]
巢狀路由網址:http://www.網址/#/order/product[2]
src/router/index.js
import Vue from vue import Router from vue-router import Order from "@/components/Order"; import Product from "@/components/Product"; Vue.use(Router) export default new Router({ routes: [ { path: /order, component: Order, children: [ { path: product, component: Product }, ] } ] })src/components/Order.vue
<template> <div> Order <router-view></router-vie...