当前位置: 首页 > article >正文

vue实现点击单选或者多选模式

toggleSelect(item) {

      if (!this.single) {

        // 多选模式

        const itemIndex = this.selectedItems.findIndex(

          (selectedItem) => selectedItem.userId === item.userId

        ); // 假设每个对象都有一个唯一的id属性

        if (itemIndex !== -1) {

          this.selectedItems.splice(itemIndex, 1);

        } else {

          this.selectedItems.push(item);

        }

      } else {

        // 单选模式

        // 直接将selectedItems设置为包含当前项目的数组

        this.dataList = this.dataList.map((item) => ({

          ...item,

          orgList: [],

        }));

        this.selectedItems = [item];

        this.selectData();

      }

    },

    isSelected(item) {

      return this.selectedItems.some(

        (selectedItem) => selectedItem.userId === item.userId

      ); // 假设每个对象都有一个唯一的id属性

    },

http://www.lryc.cn/news/2399564.html

相关文章:

  • Windows系统工具:WinToolsPlus 之 SQL Server 日志清理
  • 在Windows11上安装 Ubuntu WSL
  • 嵌入式Linux之RK3568
  • Elasticsearch的插件(Plugin)系统介绍
  • 提取 PDF 文件中的文字以及图片中的文字
  • JavaScript性能优化实战技术
  • LeetCode 热题 100 739. 每日温度
  • 网页前端开发(基础进阶3--Vue)
  • tryhackme——Abusing Windows Internals(进程注入)
  • 【游戏科学】游戏开发中数学算法的核心与应用
  • 【Day44】
  • 基于 Alpine 定制单功能用途(kiosk)电脑
  • 知识图谱系统功能实现,技术解决方案,附源码
  • 第12节 Node.js 函数
  • 洛谷P12610 ——[CCC 2025 Junior] Donut Shop
  • 1. 数据库基础
  • 英伟达288GB HBM4+50P算力
  • 【Pandas】pandas DataFrame reset_index
  • 综合案例:斗地主
  • 前端组件推荐 Swiper 轮播与 Lightbox 灯箱组件深度解析
  • 解密并下载受DRM保护的MPD(DASH流媒体)加密视频
  • 数据可视化有哪些步骤?2025高效落地指南
  • Deepfashion2 数据集使用笔记
  • Dify知识库下载小程序
  • 匀速旋转动画的终极对决:requestAnimationFrame vs CSS Animation
  • 数据库中求最小函数依赖集-最后附解题过程
  • 嵌入式系统中常用的开源协议
  • MySQL 索引底层原理剖析:B+ 树结构、索引创建维护与性能优化策略全解读
  • 系统架构设计论文
  • 第二篇:Liunx环境下搭建PaddleOCR识别