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

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

`

//置顶功能async function stickHonor(index) {    const obj = this.honorList[index];    const id = obj.id;    obj.isStick = 1;    // 调用接口置顶    const res = await stickStudentHonors({id, isStick: 1});    // 删除原位置    this.honorList.splice(index, 1);    // 将元素插入到数组开头    this.honorList.splice(0, 0, obj);}//取消置顶功能async function unstickHonor(index) {    // 计算当前被置顶的元素总数    let sum = 0;    for (const data of this.honorList) {        if (data.isStick === 1) {            sum++;        }    }    const obj = this.honorList[index];    const id = obj.id;    // 调用接口取消置顶    const res = await stickStudentHonors({id, isStick: 0});    // 删除原位置    this.honorList.splice(index, 1);    // 将元素插入到置顶前面一个位置    this.honorList.splice(sum - 1, 0, obj);}

置顶和取消置顶功能是前端常见的逻辑操作。上述代码实现了基于数组操作的置顶逻辑,其中使用splice方法进行元素插入和删除。通过这种方法,数组会自动响应式更新,避免了手动刷新的需求。

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

你可能感兴趣的文章
python_引用的本质_栈内存和堆内存_内存示意图---python工作笔记017
查看>>
python_标识符_帮助系统的使用_命名规则---python工作笔记018
查看>>
python_海龟绘图_坐标系问题_画笔各种方法---python工作笔记013
查看>>
python_海龟绘图_画出奥运五环图---python工作笔记014
查看>>
Python_生产者消费者模型、管道、数据共享、进程池
查看>>
python_程序格式_缩进_行注释_段注释---python工作笔记012
查看>>
python_程序的构成---python工作笔记015
查看>>
python_超文本传输协议
查看>>
Python_集合
查看>>
Python|AsyncIO|TypeError:应为协程
查看>>
python——random模块的应用
查看>>
Python——基础知识细节
查看>>
Python——正则表达式
查看>>
Python—面向对象2
查看>>
Python“和“带整数的运算符
查看>>
Python“文件存在“制作目录时出错
查看>>
Python“文件存在“制作目录时出错
查看>>
Python、IMAP 和 GMail.将消息标记为已查看
查看>>
python一个一个获取迭代器的元素
查看>>
python一维数组 提取_python – 如何从numpy中的1维数组中提取零维切片
查看>>