路由使用、路由跳转、路由传参

//修改src/main.js文件，加载路由
import router from ‘./router’
import store from ‘@/store/store.js’

new Vue({
el: ‘#app’,
router,
store,
components: { App },
template: ‘’
})

//修改src/App.vue文件，使用显示某个路由对应的组件，即是页面

//路由跳转，有两种方式。
this.$router.push({
name: “orderDetail”
});

this.$router.push({
path: “/orderDetail”
});

在组件中可以使用this.$router访问路由器，可以使用this.$route访问当前路由。（注意，一个是$router，另一个是$route）
还有一种是在路由path传参，使用比较少，容易混淆。
页面刷新，参数丢失，需要使用query方式传参。
//路由传参，有两种方式。

//query方式传参
传参:
this.$router.push({
path:’/xxx’,
query: {
id:id
}
})

接收参数:
this.$route.query.id

//params方式传参
传参:
this.$router.push({
name:‘xxx’,
params: {
id:id
}
})

接收参数:
this.$route.params.id

注意:params传参，push里面只能是name:‘xx’,不能是path:’/xx’,因为params只能用name来引入路由，如果这里写成了path，接收参数页面会是undefined！

直白的来说query相当于get请求，页面跳转的时候，可以在地址栏看到请求参数，而params相当于post请求，参数不会在地址栏中显示。