vue 详情或列表页(指定页)返回搜索页面,保留搜索页面上一次的筛选条件
详情页返回列表页,保留列表页之前的筛选条件将之前的搜索条件保存到cookie 中,从指定页面(详情页或列表页)返回到搜索条件页面后,从cookie中获取之前存入的参数。1、发出查询请求前,将参数存入cookie中。2、从详情页面回到查询页,从cookie中获取之前存入的参数。data{return {formPath:'',queryData:{//将startData、endDate 设置为今天
·
详情页返回列表页,保留列表页之前的筛选条件
将之前的搜索条件保存到cookie 中,从指定页面(详情页或列表页)返回到搜索条件页面后,从cookie中获取之前存入的参数。
1、发出查询请求前,将参数存入cookie中。
2、从详情页面回到查询页,从cookie中获取之前存入的参数。
data{
return {
formPath:'',
queryData:{
//将startData、endDate 设置为今天
startDate:moment().subtract(1, 'days').format('YYYYMMDD'),
endDate :moment().subtract(1, 'days').format('YYYYMMDD')
}
}
},
//获取上一个页面的路由
beforeRouteEnter (to, from, next){
next(vm => {
// 通过 `vm` 访问组件实例,将值传入fromPath
vm.fromPath = from.path
vm.getCookie(vm.fromPath);
})
},
methods:{
//设置cookie
setCookie() {
//获取当前路由,将当前页面的路由作为name存入cookie中
let name = this.$route.path;
//需要存入的参数
let value =[this.queryData.startDate,this.queryData.endDate];
let day = '1';
if (day !== 0) {
var expires = day * 24 * 60 * 60 * 1000;
var date = new Date(+new Date() + expires);
document.cookie = name + "=" + escape(JSON.stringify(value)) + ";expires=" + date.toUTCString();
} else {
document.cookie = name + "=" + + escape(JSON.stringify(value));
}
},
//从cookie中获取之前存入的参数
//data为指定页面的路由,当从指定页面返回到当前页面时才到cookie中获取上一次存入的参数 。
getCookie(data){
if("/AgeJcdSexPage" == data){
var arr;
var name = this.$route.path;
var reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
if (arr = document.cookie.match(reg)){
var test = JSON.parse(unescape(arr[2]));
this.queryData.startDate=test[0];
this.queryData.endDate=test[1];
}
}
},
doQuery(){
//查询前,将查询条件设置cookie中
this.setCookie();
//将参数带入到下一个页面进行请求
this.$router.push({name: 'AgeJcdSexPage', query: this.queryData})
}
}
更多推荐
已为社区贡献1条内容
所有评论(0)