vue 跳转路由传参数用法
// 组件 a
<template>
<button @click="sendParams">传递</button>
</template>
<script>
export default
{
name: '',
data () { return { msg: 'test message' } },
methods: {
sendParams () { this.$router.push({ path: 'yourPath', name: '要跳转的路径的 name,在 router 文件夹下的 index.js 文件内找', params: { name: 'name', dataObj: this.msg }
/*query: { name: 'name', dataObj: this.msg }*/ }) } },
computed: { }, mounted () { } }
</script>
<style scoped></style>
// 组件b
<template>
<h3>msg</h3>
</template>
<script>
export default {
name: '',
data () { return { msg: '' } },
methods: { getParams () {
// 取到路由带过来的参数
let routerParams = this.$route.params.dataobj
// 将数据放在当前组件的数据内
this.msg = routerParams } },
watch: {
// 监测路由变化,只要变化了就调用获取路由参数方法将数据存储本组件即可
'$route': 'getParams'
} }
</script>
<style scoped></style>
在mounted 生命周期函数中使用
mounted: function () {
this.$nextTick(function () {
this.getParams();
this.getSelectList();
if(this.id){
this.formItem.code=this.id;
this.fetchData();
}else{
this.fetchData();
}
})
},
以上是 vue 跳转路由传参数用法 的全部内容， 来源链接： utcz.com/z/377937.html
