博客
关于我
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/

你可能感兴趣的文章
php局域网上传文件_PHP如何通过CURL上传文件
查看>>
PHP工具插件大全
查看>>
PHP开发规范PSR
查看>>
PHP开发遇到错误0001
查看>>
php引用及垃圾回收
查看>>
php当前时间的集中写法
查看>>
php循环比较数组中的值,如何从PHP数组中计算值并在foreach循环中仅显示一次值?...
查看>>
php微信 开发笔记,微信WebApp开发总结笔记
查看>>
php怎么将对象变成数组,php怎么将对象转换成数组
查看>>
PHP性能监控 - 怎么看xhprof报告(二)
查看>>
php操作mysql用select_php如何操作mysql获取select 结果
查看>>
PHP操作符与控制结构
查看>>
php支付宝手机网页支付类实例
查看>>
PHP数据访问的多重查询(租房子查询)
查看>>
php数组函数分析--array_column
查看>>
php数组实现:哈希 +双向链表
查看>>
PHP数组排序函数array_multisort()函数详解(二)
查看>>
php数组的几个函数和超全局变量
查看>>
PHP文件锁
查看>>
php文本框输入制定文本,php – 当用户没有向文本框输入任何内容时...
查看>>