表格中的Vue ant设计选择

时间:2019-12-03 12:44:27

标签: vue.js antd

我正在将选择组件添加到表中,现在我想获取选择的项目,但是如果我将v模型添加到a-select中,则所有选择都选择相同的值,那么另一个想法是获取行的索引并添加到选择数组,但idk如何在@change事件中获取rowIndex。 如何获取行索引或获取每个a-select自身的v模型?

<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>

1 个答案:

答案 0 :(得分:0)

至少我需要在插槽中添加一个插槽范围来实现

<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>