vue3中如何拿到element plus中el-tree多选的值？

软件技术NINI2024-09-05 15:59

  • 在vue3中使用了element plus的el-tree组件 并将其设置为可选择的情况下如何拿到所选择的值？

  • 首先我们要为el-tree设置show-checkbox（它的作用是：节点是否可被选择），然后为el-tree绑定ref

  • vue3中的ref跟vue2中的ref获取方式略有不同

    vue2中我们在标签中绑定过ref后会用this.$refs.xxx来进行获取 而在vue3中我们需要先定义一下我们ref绑定的值 再通过这个值的getCheckedNodes()来获取我们所再el-tree中所选择的值 如下图所示。

相关推荐
WooaiJava19 分钟前
AI 智能助手项目面试技术要点总结（前端部分）
javascript·大模型·html5
LYFlied23 分钟前
从 Vue 到 React，再到 React Native：资深前端开发者的平滑过渡指南
vue.js·react native·react.js
Never_Satisfied39 分钟前
在JavaScript / HTML中，关于querySelectorAll方法
开发语言·javascript·html
董世昌4139 分钟前
深度解析ES6 Set与Map：相同点、核心差异及实战选型
前端·javascript·es6
B站_计算机毕业设计之家1 小时前
豆瓣电影数据采集分析推荐系统 | Python Vue Flask框架 LSTM Echarts多技术融合开发 毕业设计源码 计算机
vue.js·python·机器学习·flask·echarts·lstm·推荐算法
WeiXiao_Hyy1 小时前
成为 Top 1% 的工程师
java·开发语言·javascript·经验分享·后端
xjt_09012 小时前
基于 Vue 3 构建企业级 Web Components 组件库
前端·javascript·vue.js
我是伪码农2 小时前
Vue 2.3
前端·javascript·vue.js
辰风沐阳3 小时前
JavaScript 的宏任务和微任务
javascript
跳动的梦想家h3 小时前
环境配置 + AI 提效双管齐下
java·vue.js·spring
热门推荐
01GitHub 镜像站点02Claude Code + GLM4.7 避坑指南：解决 Unable to connect to Anthropic services03使用 1panel面板 部署 php网站04OpenClaw Chrome扩展使用教程 - 浏览器中继控制05Linux下V2Ray安装配置指南06Vue-skills的中文文档07让 Trae IDE 智能体 “读懂”文档 Excel+PDF+DOCX ：mcp-documents-reader 工具使用指南08UV安装并设置国内源09从零搭建一个 PHP 登录注册系统（含完整源码）10一文了解国产算子编程语言 TileLang，TileLang 对国产开源生态的影响与启示