程序员经验分享-hwhale

el-select与el-tree结合使用，实现select框下拉使用树形结构选择数据

2023-11-11

使用el-select与el-tree，实现如下效果，

代码如下：

 注意点：搜索input框的代码一点放在option上面，不要放在option里面，否则一点击搜索框，下拉框就会收起来，不能使用。

<el-select v-model="queryUserName" placeholder="使用人 所有" style="width:300px;" data-live-search="true" @visible-change="setUserTreeCheckNode" clearable @clear="clearUserNode">
            <el-input placeholder="搜索" v-model="userFilterText" clearable style="padding:0 20px 10px;" @input="filterUsertree"><i slot="prefix" class="el-input__icon el-icon-search" style="padding-left: 25px;"></i></el-input>
            <el-option value="queryUserName" style="min-height: 200px;overflow: auto;">
              <el-tree :data="userTreeData" show-checkbox node-key="label" :props="defaultProps" @check="userTreeCheck" ref="userTree" :filter-node-method="filterUserNode" :default-expanded-keys="['全部']">
              </el-tree>
            </el-option>
          </el-select>

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

经验，学习

前端

vue

vuejs

javascript

el-select与el-tree结合使用，实现select框下拉使用树形结构选择数据 的相关文章

  • 在 JavaScript 中生成 RSA 密钥对

    我最近发现了这个 RSA JavaScript 库 http www ohdave com rsa http www ohdave com rsa 但是 它要求预先生成密钥 这是我的问题 问题 我想在 JavaScript 中生成 RSA

  • 跨域XMLHttp请求

    这是我的情况 我有一台 Web 服务器机器 一台客户端机器和第三台运行一些侦听 XMLHttpRequest 的程序的机器 客户端从客户端计算机访问网络服务器 进行一些更改 然后单击 保存 此时 数据被发送回网络服务器和第三台机器 所有这些

  • 通过pm2运行node.js，但经常重新启动：通过信号[SIGINT]以代码[0]退出

    我试图在我的系统上运行 node js 但遇到了这个问题 2016 06 01 20 46 28 App app with id 13 and pid 12633 exited with code 0 via signal SIGINT 2

  • 打开 md-calendar 时滚动到当前日期

    目前正在构建一个使用 Angular Material 的应用程序 我们需要一个 md calendar 组件 我们想要自定义按钮样式和内容 因此不使用普通的 md datepicker 问题是 当 md calender 打开时 滚动位置

  • 了解 sort() 比较函数

    我正在使用一个电子商务平台 该平台无法重新排序产品属性字段的选项 这真的很糟糕 因为要插入新选项 您几乎必须删除所有现有选项并重新开始 我正在尝试在客户端进行操作 这是我正在处理的内容 这是针对鞋码的 9 EE 9 1 2 EE 10 EE

  • 在鼠标光标位置添加 cytoscape 节点

    我想在画布上的单击事件上的鼠标箭头位置添加一个 cytoscape 节点 我怎样才能做到这一点 我的方法 效果不太好 我可以通过单击创建一个节点 但无法确保创建的节点的位置位于我单击的位置 使用这样的东西 cy click function

  • 为什么 length 是 `Array` 的属性而不是 `Array.prototype` 链

    所以我在 V8 控制台上玩了很多 我做到了 Object getOwnPropertyNames 我期望得到 结果 然而 length 所以这意味着不是成为原型链的一部分 length是所有人的成员财产Array对象 这是一个错误 还是有任

  • 如何用javascript正确读取php cookies

    考虑这个 php 和 javascript 代码 然后我在控制台中看到的是 utma 111872281 291759993 1444771465 1445374822 1445436904 4 utmz 111872281 1444771

  • 使用文件 API 将资源加载到 Three.js 中

    我想创建导入 3D 模型以在浏览器中查看的功能 方法是使用File API http www html5rocks com en tutorials file dndfiles Three js 加载器在我托管的文件上运行良好 我的理解是加

  • 在 jQuery 可排序中对多个选定项目进行排序？

    我试图在 jQuery 可排序集中选择多个项目 然后将选定的项目一起移动 这是我的弱点开始尝试使其发挥作用 http jsfiddle net benstenson CgD8Y 这是代码 HTML div class container d

  • jQM / jquery-collagePlus 使用问题

    我正在使用 jQM 构建应用程序 并且尝试使用 jquery collagePlus http ed lea github io jquery collagePlus http ed lea github io jquery collage

  • ToggleClass 动画 jQuery？

    我的网站上有一个部分 当用户单击时我希望它展开 我正在使用 jQuerytoggleClass为了这 expandable function e e preventDefault this closest article toggleCla

  • JavaScript 测验在提出所有问题之前结束

    我现在正在学习 JavaScript 并且正在创建一个测验 我的测验运行正常 控制台中没有任何错误 但它会跳过问题 有时会在回答所有问题之前结束测验 即使给出正确答案 也会减少时间 我不太确定为什么它会这样做 因为在我看来它的编码是正确的

  • 使用日期字符串数组在引导日期选择器中设置禁用月份不起作用

    我有一个日期选择器 其配置如下 HTML div class input group date div

  • 禁用特定 div 上的 Tab 键

    我有以下结构 div div Some content div div Some content div div 我想 禁用 div2 上的 tab 键 我的意思是按下 tab 键时 div2 的元素不会获得焦点 有没有简单的方法可以使用

  • Knockout.js 安全绑定

    我想使用带有淘汰赛的安全绑定 为此我使用敲除安全绑定 js https github com brianmhunt knockout secure binding 谁能解释一下为什么下面的代码不起作用 它会抛出一个错误 未捕获 淘汰 安全

  • 尝试在 React 应用程序中连接到 MySQL 数据库时，无法读取未定义的属性（读取“查询”）错误

    我正在尝试连接到 MySQL 数据库并在单击按钮后在 React 应用程序中运行查询 一些它如何给出错误 我当前的代码如下所示 import mysql from mysql function App async function sync

  • RoR - Rails 中的大文件上传

    我有一个 Rails Web 应用程序 允许用户上传视频 视频存储在 NFS 安装的目录中 当前的设置适用于较小的文件 但我也需要支持大文件上传 最多 4GB 当我尝试上传 4GB 文件时 它最终会发生 但从用户体验的角度来看很糟糕 上传开

  • JavaScript：测试与执行

    我想知道检查字符串 例如邮件 密码等 的最佳方法是什么 i exec a vs i test a exec返回值 test true test 1 way var mail req body mail if check mail exec

  • Internet Explorer 9 是否会因数组和对象文字末尾的额外逗号而卡住？

    现代浏览器和 Node js 等环境允许您说 a 1 b 2 或 1 2 3 这在历史上一直是 Internet Explorer 的问题 Internet Explorer 9 中修复了此问题吗 对此有两种不同的答案 一种是对象初始值设定

随机推荐

  • 【C++】友元

    目录 友元的定义 全局函数做友元 类做友元 成员函数做友元 友元的定义 友元定义在类外面的一种函数或者类 友元不是成员函数 但是友元可以对某个类里面私有成员进行访问 要想友元获得访问某个类私有成员的权限 我们需要利用关键字friend并且在

  • eclipse web 项目中配置jetty-maven-plugin 版本 9.4.2.v20170220

    在web项目的pom xml文件中添加jetty maven plugin插件配置 如下

  • 【图像处理】去雾算法

    真正了解了什么叫最简单的就是最美好的 真正的好文章不需要大堆公式堆积显得充实 而是最最平实的思想 这篇文章的 原文PDF PPT 感兴趣的可以了解一下 这篇文章的目的就是以最简单的思路将图像达到去雾效果 用Matlab编了一下 效果图特别好

  • Windows11 安装 chocolatey 包管理器

    众所周知每个Linux发行版都有一个包管理器 比如Ubuntu的 apt get Centos的 yum Arch Linux的 pacman 那么问题来了 Windows有包管理器吗 Windows 目前最新版的系统有一个 winget

  • LLVM每日谈之十九 LLVM的第一本系统的书<Getting Started with LLVM Core Libraries>

    作者 史宁宁 snsn1984 LLVM最终有了一本系统的书了 Getting Started with LLVM Core Libraries 这本书号称是LLVM的第一本书 可是据说日本早就有两本日文的关于LLVM的书 这个了解的不多

  • 数据库学习笔记（4）——SQL语言之DQL

    复杂分组查询举例 子查询 把select查询结果当作数据使用时 这种结构就是子查询 子查询练习 子查询练习 查询学生成绩在70分以上的学生学号和姓名 select stu id as id stu name as 姓名 from tb st

  • 傻白探索Chiplet，关于EPYC Zen2 的一些理解记录（五）

    目录 一 知识铺垫 1 Chiplet 2 Zen架构 3 EPYC和Ryzen 4 EPYC Zen2 二 关于EPYC Zen2里的部件 1 内存控制器 2 PCIe控制器 3 Infinity Fabric总线 4 关于CCX和CCD

  • 深度学习之人物年龄预测

    1 年龄检测 论文地址 Age and Gender Classification using Convolutional Neural Networks 论文作者提出了一个简单的类似AlexNet的网络结构 该网络总共学习了8个年龄段 0

  • CentOS中DHCP服务器的搭建

    1 进入网卡配置文件 将网卡的网络修改为静态配置 2 yum y insytall dhcp 3 vi etc dhcp dhcpd conf 4 vi usr share doc dhcp dhcpd conf example 5 cp

  • 支付宝小程序 生成https链接 生成alipays协议链接

    生成https协议链接 const target 返回的页面地址 const online https render alipay com p s medical card online www index html returnUrl e

  • c语言课程设计（学生籍贯管理系统）学完c语言你可以做的案例

    目录 第一章 设计简介及设计方案讨论 1 1背景和意义 1 1 1背景 1 1 2意义 1 2需求分析 1 3使用说明 1 4流程图 1 5设计 1 5 1功能实现 第二章 核心代码讲解 2 1核心代码与分析 2 1 1代码和分析 第三章

  • tensorflow ResNet

    借鉴点 层间残差跳连 引入前方信息 减少梯度消失 使神经网络层数变身成为可能 ResNet 即深度残差网络 由何恺明及其团队提出 是深度学习领域又一具有开创性的 工作 通过对残差结构的运用 ResNet 使得训练数百层的网络成为了可能 从而

  • ROS理论与实践学习汇总（持续更新中······）

    创建工作空间 创建工作空间 mkdir p catkin ws src cd catkin ws src catkin init workspace 初始化 编译工作空间 cd catkin ws catkin make 设置环境变量 so

  • 07黑马QT笔记之信号重载时connect的写法(带参数的信号)

    07黑马QT笔记之信号重载时connect的写法 带参数的信号 1 首先说这个例子要做的事情 一个窗口有两个按钮 分别为按钮1 按钮2 当我按下按钮2时 他会发射两个信号 这两个信号重载 名字一样 所以当我接收这两个信号并处理时 conne

  • Web存储

    1 Web存储 locationStorage 用于永久性保存数据 sessionStorage 用于临时存储数据 关闭页面时 数据丢失 用法 两个对象用法一致 setItem key value 存储数据 getItem key 取数据

  • Java如何制作图片输入验证码

    Java如何制作图片输入验证码 简介 验证码 CAPTCHA 是 Completely Automated Public Turing test to tell Computers and Humans Apart 全自动区分计算机和人类的

  • 树莓派4b串口设置教程（适用于新手）

    树莓派4b串口设置教程 适用于新手 树莓派4b串口配置 适用于新手 本人也是刚刚学习了树莓派 考虑到目前入坑的像我一样的小白比较多 所以我整理了一下前辈们的各种经验 准备针对树莓派4b这款最新的产品 做一个比较详细简单的串口配置介绍 1 基

  • 似然和概率的透彻解析 ------- 最大似然估计(Maximum likelihood estimation)

    似然与概率 在统计学中 似然函数 likelihood function 通常简写为likelihood 似然 是一个非常重要的内容 在非正式场合似然和概率 Probability 几乎是一对同义词 但是在统计学中似然和概率却是两个不同的概

  • Cocos Creator Android打包 apk

    文章目录 1 引言 2 配置打包环境 2 1 下载Java SDK JDK 2 2 下载NDK 3 配置原生发布环境路径 4 打包发布原生平台 5 构建原生工程 6 通过编译器去编译和运行 7 总述 8 结束语 1 引言 今天事情不是很多抽

  • el-select与el-tree结合使用，实现select框下拉使用树形结构选择数据

    使用el select与el tree 实现如下效果 代码如下 注意点 搜索input框的代码一点放在option上面 不要放在option里面 否则一点击搜索框 下拉框就会收起来 不能使用

热门标签