Vue动态渲染el-row：添加和删除带下拉框的行

<template>
  <div>
    <el-button @click="addRow">添加行</el-button>
    <el-row v-for="(row, index) in rows" :key="index">
      <el-col :span="8">
        <el-select v-model="row.selectValue" placeholder="请选择">
          <el-option v-for="option in options" :key="option.value" :label="option.label" :value="option.value"></el-option>
        </el-select>
      </el-col>
      <el-col :span="8">
        <el-button @click="removeRow(index)">移除行</el-button>
      </el-col>
    </el-row>
  </div>
</template>
<script>
export default {
  data() {
    return {
      rows: [], // 存储每个el-row的数据
      options: [ // 下拉框的选项
        { value: 'option1', label: '选项1' },
        { value: 'option2', label: '选项2' },
        { value: 'option3', label: '选项3' }
      ]
    };
  },
  methods: {
    addRow() {
      // 在rows数组中添加一个新的el-row的数据
      this.rows.push({
        selectValue: ''
      });
    },
    removeRow(index) {
      // 在rows数组中移除指定索引的el-row的数据
      this.rows.splice(index, 1);
    }
  }
};
</script>