请问一下elementUI如何实现menu和tabs联动？

Question

红色框内的功能在elementui中有这样的功能吗？如果没有那么这个用的什么插件实现的呢？

Answer 1

这个功能可以使用 Element UI 的 el-upload 组件来实现。el-upload 组件是一个文件上传组件，支持文件的选择、拖拽、进度条显示等功能。你可以在官网的文档中查看更多信息和用法示例。下面是一个简单的示例代码：

<template>
  <el-upload
    class="upload-demo"
    action="/upload"
    :on-preview="handlePreview"
    :on-remove="handleRemove"
    :before-remove="beforeRemove"
    :file-list="fileList"
    multiple
    :limit="3"
    :on-exceed="handleExceed"
    :auto-upload="false"
    list-type="picture-card">
    <i class="el-icon-plus"></i>
    <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
    <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
  </el-upload>
</template>

<script>
export default {
  data() {
    return {
      fileList: [
        {
          name: 'food.jpg',
          url: 'https://www.example.com/food.jpg'
        },
        {
          name: 'drink.jpg',
          url: 'https://www.example.com/drink.jpg'
        }
      ]
    };
  },
  methods: {
    handlePreview(file) {
      console.log('handle preview', file);
    },
    handleRemove(file, fileList) {
      console.log('handle remove', file, fileList);
    },
    beforeRemove(file, fileList) {
      return this.$confirm(`确定移除 ${file.name}？`);
    },
    handleExceed(files, fileList) {
      this.$message.warning(`只能上传 ${this.limit} 个文件哦！`);
    }
  }
};
</script>

这里用到的是 el-upload 组件的 list-type="picture-card" 属性，表示以图片卡片的形式展示上传的文件。你可以根据自己的需求来设置其他属性。