vue保存搜索条件

此方法仅供参考

参数对象

      queryParams: {
        pageNum: 1,
        pageSize: 10,
        name: undefined,
        gender: undefined
      }

1.在跳转详情页的路由，保存参数

      sessionStorage.setItem("queryParams",JSON.stringify(this.queryParams))
      this.$router.push({ path: '/oper/detai', query: {params} })

2.在详情页添加标识

mounted() {
    sessionStorage.setItem("searchFlag", true);
  }

3.在查询函数添加标识判断

created() {
      if (sessionStorage.getItem("searchFlag")==='true') {
        this.queryParams = JSON.parse(sessionStorage.getItem("queryParams"))
      }else {
        // 首次进入列表页,清除缓存中的搜索条件
        sessionStorage.removeItem("queryParams")
      }
      // 查询数据.....
}

4.离开列表页销毁标识

  destroyed() {
    // 销毁
    sessionStorage.removeItem("searchFlag");
  }

5.如果有重置按钮，根据情况判断

      if (sessionStorage.getItem("searchFlag")) {
        sessionStorage.setItem("searchFlag", false);
      }
      // 参数对象重置
      this.queryParams = this.$options.data().queryParams;
      //查询....

6.如果有搜索按钮，根据情况判断

handleQuery() {
      // 设置参数
      if (sessionStorage.getItem("searchFlag")) {
        sessionStorage.setItem("queryParams",JSON.stringify(this.queryParams))
      }
      //调用查询方法
    }