linksocarina 2020-07-27 13:23 采纳率: 100%
浏览 1575
已采纳

ElementUI使用穿梭框的时候,我的文本一直显示不出来

如图,能够正确选择,通过控制台也能看到数据已经成功传入对象
我是按照官网的改的,但是原理应该没问题吧

<template>
<div>
<el-button type="primary" @click="dialogVisible = true">建立新群组</el-button>
<br><br>
<el-dialog
  title="请选择您要邀请的成员" :visible.sync="dialogVisible"
  width="50%" :before-close="handleClose" :show-close="false" :modal="true">
  <el-transfer class="selectMembers"
    filterable  :filter-method="filterMethod"
    filter-placeholder="请输入城市拼音"
    v-model="value2" :data="data2">
  </el-transfer>
  <span slot="footer" class="dialog-footer">
    <el-button @click="CancelOperation">取 消</el-button>
    <el-button type="primary" @click="ConfirmOperation">确 定</el-button>
  </span>
</el-dialog>
</div>
</template>

<script>
export default {
  data () {
    return {
      dialogVisible: false,
      data2: [],
      value2: ['1', '2', '3']
    }
  },
  methods: {
    filterMethod (query, item) {
      return item.pinyin.indexOf(query) > -1
    },
    CancelOperation () {
      this.$message({
        type: 'warning',
        message: '取消建立群组'
      })
      this.dialogVisible = false
    },
    ConfirmOperation () {
      this.$message({
        type: 'success',
        message: '建群成功'
      })
      this.dialogVisible = false
    },
    handleClose () {
    }
  },
  created () {
    // 这里要把从后端把全公司的人都拿下来,以便给建群的选择
    const cities = ['上海', '北京', '广州', '深圳', '南京', '西安', '成都']
    const pinyin = ['shanghai', 'beijing', 'guangzhou', 'shenzhen', 'nanjing', 'xian', 'chengdu']
    cities.forEach((city, index) => {
      this.data2.push({
        key: index,
        label: city,
        pinyin: pinyin[index]
      })
    })
    console.log(this.data2)
  }
}
</script>

<style>
.selectMembers {
  color: wheat
}
</style>

图片说明

  • 写回答

4条回答 默认 最新

  • 浴火_凤凰 2020-07-27 14:14
    关注

    你使用官方的例子再重新写一遍吧。
    https://element.eleme.cn/#/zh-CN/component/transfer

    只看到一个区别 filterMethod没有在methods里面 你的在里面
    属性配置 :data="data"
    第二个data 有没有可能指的是 data () 函数 如果是的话 那你的例子和官方就完全不一样了

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(3条)

报告相同问题?

问题事件

  • 已采纳回答 12月5日

悬赏问题

  • ¥20 基于MSP430f5529的MPU6050驱动,求出欧拉角
  • ¥20 Java-Oj-桌布的计算
  • ¥15 powerbuilder中的datawindow数据整合到新的DataWindow
  • ¥20 有人知道这种图怎么画吗?
  • ¥15 pyqt6如何引用qrc文件加载里面的的资源
  • ¥15 安卓JNI项目使用lua上的问题
  • ¥20 RL+GNN解决人员排班问题时梯度消失
  • ¥60 要数控稳压电源测试数据
  • ¥15 能帮我写下这个编程吗
  • ¥15 ikuai客户端l2tp协议链接报终止15信号和无法将p.p.p6转换为我的l2tp线路