elementui el-tree多级组织结构实现增删改查及关键字搜索过滤效果代码

代码语言:html

所属分类:其他

代码描述:elementui el-tree多级组织结构实现增删改查及关键字搜索过滤效果代码

代码标签: element ui el-tree 多级 组织 结构 增删改查 关键字 搜索 过滤

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/element-ui.2.15.1.css">
    <style>
        .custom-tree-node {
          flex: 1;
          display: flex;
          align-items: center;
          justify-content: space-between;
          font-size: 14px;
          padding-right: 8px;
        }
        .show-hide:hover :nth-child(2) {
          display: inline-block !important;
        }
    </style>

</head>

<body>

    <div id="app">
        <div id="hacker-list">
            <el-input v-model="filterText" style="width:200px" placeholder="请输入关键字搜索"></el-input>


            <el-dialog :visible.sync="visible" title=" 选择人员">
                <el-tabs>
                    <el-tab-pane label="员工">
                        <p v-for="(item, index) in allemployees" @click="choose(item)" :key="index">{{item}}</p>
.........完整代码请登录后点击上方下载按钮下载查看

网友评论0