element ui Transfer 穿梭框清除查询条件

最新推荐文章于 2024-05-23 11:33:26 发布

帅宇Yeah~

最新推荐文章于 2024-05-23 11:33:26 发布

阅读量1.2k

点赞数

分类专栏： VUE 文章标签： ui vue.js

本文链接：https://blog.csdn.net/qq_43383907/article/details/122848284

版权

VUE 专栏收录该内容

5 篇文章 1 订阅

订阅专栏

关闭后清除查询条件
在这里插入图片描述

1.弹出框代码
关闭方法：closeroleFormVisible

<el-dialog ref="roleTransfer" :title="dialogTitle" :visible.sync="roleFormVisible" width="50%" @close="closeroleFormVisible">
      <el-transfer v-model="checkedRoleData" :data="allRoleData" filterable :titles="['未有角色', '已有角色']" filter-placeholder="请输入" />
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" size="small" @click="editUserRoles">分 配</el-button>
        <el-button size="small" @click="roleFormVisible = false">取 消</el-button>
      </div>
    </el-dialog>

2.方法代码

// 关闭添加框
    closeroleFormVisible() {
      console.log('----roleTransfer----', this.$refs.roleTransfer)
      // 清空搜索框内容
      const tr = this.$refs.roleTransfer.$children[2]
      if (tr) {
        // 左侧搜索框 0
        tr.$children[0].query = ''
        // 右侧搜索框 3
        tr.$children[3].query = ''
      }
    }

说明
在这里插入图片描述