VUE列表默认全选

不借助列表插件中的默认属性，通过forEach＋push实现列表全选

在开发过程中，客户提出需求如下：不添加全选按钮，在用户点击缴费功能后，展示的代缴费列表已经默认全选，用户不需要再进行点击选择。
实现效果如下：

一开始考虑通过添加一个全选按钮实现全选，但是后来发现对于项目的实际情况来说，forEach＋push即可实现。代码如下：

 // 首先查询待缴费数据
    queryOrderFeeData() {
      let selfPaymentOrderFee = {
        platformUserId: 获取platformUserId,
        platformId: 获取platformId,
        patId: 获取patId,
        cardNo: 获取cardNo,
      };
  	  Axios.post("/getOrderFeeData",selfPaymentOrderFee).then(res=> {
        if (res.data.ok) {
          if(res.data.data.data.length > 0){
            this.orderFeeList = res.data.data.data;
            this.orderFeeList.forEach(el=> {
              el.value = el.itemCode + "," + el.totalCost + "," + el.itemName;
            });
              this.chooseAllList();  //第二步：调用全选函数
          }else {
            this.orderFeeList = [];
            this.showTextToast("没有查到数据");
          }
	 }

将药品待缴费列表，遍历后push到新建的选中列表newCheckList中，后将值赋给checkList

methods: {
      chooseAllList() {
          if (this.checkList.length < this.orderFeeList.length) {
              this.newCheckList = [];
              this.orderFeeList.forEach(item => {
                  this.newCheckList.push(item.value);
                  this.checkList = this.newCheckList;
              });
          }
      }
}

watch监听到checkList的变化，就会重新计算缴费金额：

 watch: {
    checkList: function () {
      this.selectItemCode = [];
      this.totalFee = "0.00";
      if(this.checkList.length > 0){
        // 计算选择的金额
          this.checkList.forEach(el=> {
            let item = el.split(",");
            this.selectItemCode.push(item[0]);
            this.totalFee = (parseFloat(this.totalFee) + parseFloat(item[1])).toFixed(2);
          });
      }else {
        this.enabledStatus = false;
      }
    }
  },

菜狗学习路上摸索中，嘿嘿！！欢迎有疑问留言交流学习~