vue router動態路由
阿新 • • 發佈:2021-07-08
動態id
index.js
export default new Router({
routes: [{
path: '/Furong/:id',
name: 'Furong',
component: Furong
},
})
App.vue
<template> <div id="app"> <img src="./assets/logo.png"> <router-link :to="'/Furong/' + id" replace="">Furong</router-link> <router-view /> </div> </template> <script> export default { name: 'App', data() { return { id: '123', } } } </script> <style> </style>
Furong.vue
<template> <div id="Furong"> <p>{{msg}}</p> <p>{{userId}}</p> </div> </template> <script> export default { name: 'Furong', data() { return { msg: 'hello furong!' } }, computed: { userId() { return this.$route.params.id; } } } </script> <style> #Furong { color: green; } </style>