解决elementUI中穿梭框（transfer）组件搜索框中内容清除问题

迷途大灰狼

于 2020-04-14 15:36:26 发布

阅读量4.7k

点赞数 4

分类专栏： elementUI

原文链接：https://blog.youkuaiyun.com/wendy_monkey/article/details/89212524

版权

elementUI 专栏收录该内容

2 篇文章

订阅专栏

本文介绍如何在ElementUI的穿梭框（transfer）组件中清除搜索框的内容，通过访问组件的内部数据属性实现搜索框的自动清除，适用于在切换不同页面或组件时保持界面的整洁。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

清除elementUI中穿梭框（transfer）组件搜索框中的内容

<el-transfer
            filterable
            filter-placeholder="请输入"
            v-model="houseLists"
            :data="lists"
            ref="myTransfer">
</el-transfer>

搜索框如下图，在打开下一个有穿梭框的窗口时搜索框内容未自动清除：

清除搜索框中内容的代码如下：

if(this.$refs.myTransfer){              
          this.$refs.myTransfer.$children["0"]._data.query = '';
          // 清空右边搜索
          this.$refs.myTransfer.$children["3"]._data.query = '';
        }