router二次跳转不刷新的问题

Posted 2021-06-30 苏格拉的底

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();