vue点击跳转和其他页面获取此页面传递的参数
<div class="card-panel" @click="handleSetLineChartData('unTotal')">传递参数:methods: {handleSetLineChartData(type) {if (type === 'userTotal') {this.$router.push({path...
·
<div class="card-panel" @click="handleSetLineChartData('unTotal')">
传递参数:
methods: {
handleSetLineChartData(type) {
if (type === 'userTotal') {
this.$router.push({
path: 'power/user',
name: 'user'
})
}
if (type === 'unTotal') {
this.$router.push({
path: '/pig/blockChain',
name: 'blockChain',
params: {
state: '0'
}
})
}
if (type === 'suTotal') {
this.$router.push({
path: '/pig/blockChain',
name: 'blockChain',
params: {
state: '1'
}
})
}
if (type === 'erTotal') {
this.$router.push({
path: '/pig/blockChain',
name: 'blockChain',
params: {
state: '2'
}
})
}
}
}
....
其中:
name:是router/index.js中的(菜单配置)
{ path: 'blockChain', component: _import('pig/blockChain'), name: 'blockChain', meta: { title: '区块链信息', noCache: true }}
接收:
methods: {
getParams() {
// 取到路由带过来的参数
const routerParams = this.$route.params.state
console.log(routerParams)
// 将数据放在当前组件的数据内
this.listQuery.state = routerParams
},
watch: {
// 监测路由变化,只要变化了就调用获取路由参数方法将数据存储本组件即可
'$route': 'getParams'
}
加载列表的方法:
getList() {
this.getParams()
this.listLoading = true
listCollect(this.listQuery).then(response => {
this.list = response.data.data.items
this.total = response.data.data.total
this.listLoading = false
}).catch(() => {
this.list = []
this.total = 0
this.listLoading = false
})
},
更多推荐
已为社区贡献17条内容
所有评论(0)