封装a-table需要对表传入相关操作(增、删、改、查)
1.封装ant-table.vue组件
<a-table> //插槽进行相关操作外部插入 <template #action="{ text,record }" slot="action"> <slot :scope="record" name="operation"></slot> </template> </a-table>
2.在外部组件引入使用
//导入组件 import AntTable from "./ant-table.vue" //使用 <AntTable> <template v-slot:operation="scopeData"> <a-button type="text" @click="operation({ type: 'EDIT', data: scopeData.scope })" > <FormOutlined title="编辑" class="operation-span" /> </a-button> <a-button @click="operation({ type: 'DELETE', data: scopeData.scope })" type="text" > <DeleteOutlined title="删除" class="operation-span" /> </a-button> </template> </AntTable>