Question

我目前正在尝试创建小功能，我需要一些帮助。

我有一堆复选框过滤器。在每个复选框上单击我正在发出API请求以检索数据。

apiQS: function() {
  return '?pageIndex=' + this.pageIndex + '&pageSize=' + this.pageSize + 
    this.brandCheck() + this.colourCheck() + this.priceCheck()
},
constructApiURL: function (){
  return this.apiBase + this.apiQS();
}

<template>
 <ul>
  <li v-for="(price, index) in prices" v-bind:key="index">
   <input type="checkbox" name="prices" v-bind:value="price.qsValue" v-model="checked" v-on:change="changePrices()" v-bind:disabled="price.facetHits === 0">{{price.facetName}} ({{price.facetHits}})
  </li>

  {{checked}}
 </ul>
</template>

我也在使用＆＃39; window.history.pushState＆＃39;用于查看URL

中所有选中的复选框的功能

history.pushState(null, null, this.apiQS());

我的问题是：

如何在页面刷新时保留所有选中的复选框
当用户根据网址参数后退/前进时，如何取消选择/选中复选框

注意：此项目不使用jQuery。解决方案必须是VUEJS或纯JavaScript

VueJS - 网络历史|根据URL参数选择/取消选中复选框保持页面刷新选择

0 个答案: