表格中的 Vue ant 设计选择答案

【问题标题】：Vue ant design select in table表格中的 Vue ant 设计选择
【发布时间】：2019-12-03 12:44:27
【问题描述】：

我正在将选择组件添加到表中，现在我想获取选定的项目，但是如果我将 v-model 添加到 a-select 我的所有选择中选择相同的值，另一个想法是获取行索引并添加到选择数组，但不知道如何在@change 事件中获取 rowIndex。如何获取行索引或为每个 a-select 获取它自己的 v-model？

<a-table
        :columns="columns"
        :dataSource="data"
        :scroll="{ x: 'max-content' }"
        :pagination="{ pageSize: 9 }">
        <template slot="Client">
            <a-select v-model="selected" style="width: 200px" @change="handleChange">
               <a-select-option v-for="client in getProjects" :key="client" :value="client">
                  {{client}}
               </a-select-option>
            </a-select>
        </template>
</a-table>

【问题讨论】：

标签： vue.js antd

【解决方案1】：

至少我需要在我的插槽中添加一个插槽范围，以实现它

<a-table
                :columns="columns"
                :dataSource="data"
                :scroll="{ x: 'max-content' }"
                :pagination="{ pageSize: 6 }">
            <template slot="Client" slot-scope="text, record">
                <a-select v-model="selected[record.key - 1]" style="width: 200px">
                    <a-select-option v-for="client in getProjects" :key="client" :value="client">
                        {{client}}
                    </a-select-option>
                </a-select>
          </template>

【讨论】：