element ui 限制el-transfer穿梭框传送的数据

效果如下，右侧只能放三条数据，可以自己调试

 代码如下，直接粘贴复制即可

<template>
  <el-transfer
      v-model="value"
      filterable
      :data="box"
      @change="transferChange"
      @left-check-change="leftCheckChange"
      :titles="['可选列表', '已选中']"
  ></el-transfer>
</template>

<script>
export default {
  data() {
    return {
      box: [],
      value: [],
    }
  },
  methods: {
    get() {
      for (let i = 0; i < 8; i++) {
        this.box.push({
          key: i,
          direction: 'left',
          label: `备选项 ${i}`,
          disabled: false,
        })
      }
    },
    transferChange(leftData, direction, rightData) {
      console.log('transferChange', leftData, direction, rightData)
      if (direction == 'right') {
        this.box.map((item) => {
          if (rightData.includes(item)) {