055——VUE中vue-router之路由参数的随意设置与伪静态链接地址处理:
<!DOCTYPE html> <html > <head> <meta charset="UTF-8"> <title>vue-router之路由参数的随意设置与伪静态链接地址处理:</title> <script src="vue.js"></script> <script src="vue-router.js"></script> </head> <body> <div > <router-link to="/content">链接</router-link> <br/> <router-view></router-view> </div> <script type="text/x-template" > <div> cid:{{$route.params.cid}}----id:{{$route.params.id}} <br/> <button @click="show">点击按钮</button> </div> </script> <script> const content = { template: "#content", methods: { show() { console.log(this.$route.params); } } } let routes = [ {path: '/content/:cid/show/:id', component: content} ] let router = new VueRouter({routes}); new Vue({ el: "#demo", router }); </script> </body> </html>
地址:http://localhost/vueTest/055.html#/content/11/show/22
- 上一篇 »vue题目
- 下一篇 »vue 之 动态路由,填坑