对路由进行编程

<!-- 对路由进行编程 -->

<!-- 前面的是用router-link在页面生成a标记然后进行url转向的，其实不止可以用a标记实现，还可以通过编程的方式来实现 -->

<p>

<button @click="btnClick(1)">库里2</button>

<button @click="btnClick(2)">哈登2</button>

<router-link :to="{ name:'Player',params:{ uid : 1}}">库里3</router-link>

<router-link :to="{ path: '/player/2/stats'}">哈登3</router-link>

<!-- 不加冒号就直接写路由路径，写冒号就应该写java的脚本或者对象，就是push方法里面的参数, -->

</p>

 

methods:{

btnClick(uid){

this.$router.push({path:`/player/${uid}`});

//到球员的主页

// 这个地方不是用引号而是`

// this.$router.push({path:`/player/${uid}/sta`});

//链接到数据页面

// this.$router.push({ name:'Player',params:{ uid : uid}});

//用name进行链接也可以进入到页面，但是传入的uid为数值型号，需要在路由的Player.vue组件中给uid加上toString的方法

// this.$router.push({ path:'/Player',query:{ uid : uid}});

//url-get参数的写法

// this.$router.go(-1);

//利用属性进行翻页，定位到上一个页面，1是往前走

}

}

 

###index.js

{

path: '/twentythree',

name: 'twentythree',//name是名字，可有可无

component: twentythree,

alias: '/three'

//路由的别名，意思是通过这个url（路由）也可以跳转到这个页面

},

{

//url的重定向

path: '/curry',

// redirect:'/player/1'

// redirect:'/twentytwo'

//这两种写法都是可以的

redirect: { name: 'About' }

//直接指向自定义页面，也就是组件

},