博客
关于我
vue页面数组做数据置顶
阅读量:529 次
发布时间:2019-03-08

本文共 953 字,大约阅读时间需要 3 分钟。

//置顶    async stickHonor(index) {    //index为数据当前下标      let obj = this.honorList[index];      const id = obj.id;      obj.isStick = 1;      console.log(id);      const isStick = 1;   //置顶状态      const res = await stickStudentHonors({ id,isStick });  //调用接口改变数据状态      //删除之前的位置的数据      this.honorList.splice(index, 1);      //在数组下标为0插入数据,每次置顶数据都是在最前面      this.honorList.splice(0, 0, obj);    },    //取消置顶    async unstickHonor(index) {   //index为数据当前下标      let sum = 0;      for (let data of this.honorList) {        if (data.isStick == 1) {          sum++;        }      }      let obj = this.honorList[index];      const id = obj.id;      const isStick = 0;    //为不置顶      const res = await stickStudentHonors({ id,isStick });    //调用接口改变数据的状态      obj.isStick = 0;      //删除之前的位置的数据      this.honorList.splice(index, 1);      //置顶数据下面插入数据,因为sum把之前自己置顶的也算进去,所以sum-1      this.honorList.splice(sum-1, 0, obj);    }

   因为splice()方法为vue数组的响应式方法,所以会自动刷新数据

转载地址:http://ffviz.baihongyu.com/

你可能感兴趣的文章
nacos源码 nacos注册中心1.4.x 源码 spring cloud alibaba 的discovery做了什么 nacos客户端是如何启动的(二)
查看>>
nacos源码 nacos注册中心1.4.x 源码 如何注册服务 发送请求,nacos clinet客户端心跳 nacos 注册中心客户端如何发送的心跳 (三)
查看>>
Nacos简介、下载与配置持久化到Mysql
查看>>
Nacos简介和控制台服务安装
查看>>
Nacos管理界面详细介绍
查看>>
Nacos编译报错NacosException: endpoint is blank
查看>>
nacos自动刷新配置
查看>>
nacos运行报错问题之一
查看>>
Nacos部署中的一些常见问题汇总
查看>>
NACOS部署,微服务框架之NACOS-单机、集群方式部署
查看>>
Nacos配置Mysql数据库
查看>>
Nacos配置中心中配置文件的创建、微服务读取nacos配置中心
查看>>
Nacos配置中心集群原理及源码分析
查看>>
nacos配置在代码中如何引用
查看>>
nacos配置新增不成功
查看>>
nacos配置自动刷新源码解析
查看>>
nacos集成分布式事务插件Seata的序列化问题,实际上是Seata本身存在bug!!
查看>>
Nacos集群搭建
查看>>
nacos集群搭建
查看>>
nacos集群网络分区对的影响和运维方式
查看>>