标签:router return exp 修改 get layer case update out
在components文件夹中新建一个.vue文件
<template> <div> {{msg}} </div> </template> <script> export default{ name:‘player‘, data(){ return { msg:{} } }, mounted(){ this.msg=this.getPlayer(this.$route.params.uid); }, beforeRouteUpdate(to,from,next){ this.msg=this.getPlayer(to.params.uid); next(); }, methods:{ getPlayer(uid){ switch (uid) { case ‘1‘: return {id:1,name:‘哈登‘}; break; case ‘2‘: return {id:2,name:‘姚明‘}; break; default: return {id:-1}; // statements_def break; } } } } </script>
修改App.vue,增加组件链接<router-link to=‘‘></router-link>
修改router文件夹中的index.js文件 导入组件 import,设置路由
import Vue from ‘vue‘ import Router from ‘vue-router‘ import HelloWorld from ‘@/components/HelloWorld‘ import player from ‘@/components/player‘ Vue.use(Router) export default new Router({ routes: [ { path: ‘/‘, name: ‘HelloWorld‘, component: HelloWorld },{ path:‘/player/:uid‘, name:‘player‘, component:player } ] })
标签:router return exp 修改 get layer case update out
原文地址:https://www.cnblogs.com/m-yk/p/9797665.html