穿梭框+el-tree，递归实践

完成的效果图：

使用的组件：

Tag.vue
<template>
  <div class="flow-layer-tag-wrapper">
    <div class="left">
      <p class="title">可选标签</p >
      <!-- 搜索区 -->
      <div class="search">
        <el-input placeholder="请输入关键字" v-model="filterTagName" clearable>
        </el-input>
      </div>
      <!-- 左边内容区 -->
      <div class="content">
        <!-- 树形组件 -->
        <div class="tag-top">
          <el-tree
            ref="tree"
            :data="treeData"
            :props="treeProps"
            node-key="label"
            :check-on-click-node="true"
            highlight-current
            show-checkbox
            :filter-node-method="filterNode"
            default-expand-all
            @check="handleCheckChange">
          </el-tree>
        </div>
      </div>
    </div>
    <!-- 右边内容区 -->
    <div class="right">
      <p class="title">已选标签</p >
      <div class="search">
        <el-input placeholder="请输入关键字" v-model="selectedName" clearable>
          <el-button slot="append" @click="handleReset">清空</el-button>
        </el-input>
      </div>
      <div class="content" v-if="selectedTags.length">
        <div class="block" v-for="(tagItem, index) in searchSelectedTags" :key="index">
          <div class="wrapper" @click="handleChecked(index)" :class="[currentIndex === index ? 'active' : '']">
            <div class="main">
              <div :span="20" class="tag" v-for="(child, childIndex) in tagItem" :key="child.label">
                <div>{
  { child.value }}</div>
                <el-button icon="el-icon-minus" type="danger" class="tag-btn" circle  @click="handleDelete(child, childIndex, index)"></el-button>
              </div>
            </div>
            <el-button size="mini" type="text" style="width: 40px; color: #999;">并集</el-button>
          </div>
          <el-button size="mini" type="text" v-if="index === selectedTags.length - 1" @click="handleAddWrapper">新建交集</el-button>
          <el-button size="mini" v-else>交集</el-button>
        </div>
      </div>
      <div v-else class="content-empty">
        请从左侧添加标签
      </div>
    </div>
  </div>
<