请使用vue和element-ui，点击添加按钮，右侧会出现一个下拉框，下拉框左侧需要用线连接起来，生成一套代码，谢谢你

非常感谢您的提问！这是一道关于Vue和Element-UI的问题，需要在点击添加按钮后，生成一个带有下拉框的界面，左侧需要连接起来。根据我的理解，您需要生成一些线条来增加视觉效果，这可以通过CSS编写来实现。接下来，您可以使用Vue的组件，结合Element-UI的下拉框组件来完成您的需求。

下面是一个示例代码：

<template>
  <div class="container">
    <el-button @click="showDropdown">添加</el-button>
    <div class="dropdown-line">
      <el-select v-show="show" v-model="selectedOption" class="dropdown">
        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
      </el-select>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      show: false,
      selectedOption: '',
      options: [
        { value: '1', label: '选项1' },
        { value: '2', label: '选项2' },
        { value: '3', label: '选项3' }
      ]
    }
  },
  methods: {
    showDropdown() {
      this.show = !this.show;
    }
  }
}
</script>

<style>
.container {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.dropdown-line {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.dropdown {
  position: relative;
  width: 200px;
  margin-left: 20px;
}

.dropdown .el-input__inner {
  border-radius: 0;
}

.dropdown .el-select-dropdown__wrap {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  margin-left: 20px;
}

.dropdown .el-scrollbar__wrap {
  overflow: hidden;
}

.dropdown .el-scrollbar__view {
  padding-right: 0;
}

.dropdown .el-select-dropdown__item {
  padding-right: 35px;
}

.dropdown .el-select-dropdown__item:hover {
  background-color: #e6f7ff;
}

.dropdown .el-select-dropdown__item.selected {
  background-color: #ecf5fa;
}

.dropdown:before,
.dropdown:after {
  content: "";
  position: absolute;
  top: 50%;
  height: 2px;
  background: #ccc;
  width: 20px;
  margin-top: -1px;
}

.dropdown:before {
  left: -20px;
}

.dropdown:after {
  right: -20px;
}
</style>

在上面的代码中，我使用了Vue组件来生成一个按钮和一个下拉框，根据您的需求，右侧会出现一个下拉框，并且左侧会自动连接一条线。您可以根据需要进行调整和优化。希望能够对您有所帮助！