router路由页面二次跳转不刷新数据的问题,已经带参了二次请求的时候
本来打算在count页面带参跳转到device
count页面按钮 <el-button size="mini" type="text" icon="el-icon-tickets" @click="handleDetail(scope.row)" v-hasPermi="['lock:device:detail']">
主要是一个@click方法
handleDetail(row) {
let sn = row.sn
this.$router.push(
{path:'/device/device/',
query:{sn: sn}
},
);
},
watch: {
'$route' (to, from) {
this.$router.go(0);
}
},
这个watch是为了防止第二次页面跳转的时候不刷新,已经带参数了却刷新,如果你手动F5刷新页面再跳转又会刷新了,
使用watch避免二次跳转不刷新问题
接受跳转的页面写
created方法下写
watch: {
'$route' (to, from) {
this.$router.go(0);
}
},
methods方法下写
// 取到路由带过来的参数
const routerParams = this.$route.query.sn
// 将数据放在当前组件的数据内
this.queryParams.sn = routerParams;
this.handleQuery();
this.reset();
this.resetQuery();
this.getList();