Ant 自定义按钮

Ant design 的 a-modal 去除取消按钮,确定按钮,自定义按钮 或 添加多个按钮

 <a-modal v-model="visible" title="免责声明" :maskClosable="false" :width= "800" :closable="false" >
      <template slot="footer">
        <a-button key="submit" type="primary" @click="handleOk">
          同意声明
        </a-button>
        <a-button key="cancel" type="primary" @click="handlecancel">
          取消
        </a-button>
        <a-button key="other" type="primary" @click="handlecancel">
          其他的
        </a-button>
      </template>
      <p class="respinner"> 

          免责声明内容

      </p>
    </a-modal>

使用

<template slot= 'footer"> 就成功啦

去掉全部底部按钮可直接  :footer=null

EditableProtable是一个基于Ant Design Pro的表格组件,它提供了丰富的编辑功能和定制选项。如果你想在EditableProtable中添加自定义按钮,并针对这些按钮实现子集操作,你可以按照以下步骤进行: 1. **引入依赖**: 首先,确保你已经安装了`antd@4.x`和`@ant-design/pro-table@latest`,因为EditableProtable是在这个基础上扩展的。 2. **创建列定义**: 在表头配置中,你可以添加一个新的列,指定列类型为`ProTable.Action`,然后提供一个数组,定义你要显示的按钮及其处理函数。 ```jsx import { Column } from '@ant-design/pro-table'; const columns = [ { title: '操作', dataIndex: '', width: 80, render: (text, record) => ( <div> {/* 自定义按钮 */} <Button type="primary" onClick={() => handleCustomAction(record)}> 操作1 </Button> {/* 可能的其他按钮... */} </div> ), }, // ...其他列... ]; ``` 3. **定义处理函数**: `handleCustomAction`函数会根据你的业务逻辑来处理点击事件,比如展开子集、修改数据等。你可以在这个函数内部实现对子集的操作。 ```jsx const handleCustomAction = async (record) => { // 根据需要,这里可以展开子集数据、加载更多、提交更改等 const childrenData = await fetchDataForSubSet(record.id); // 假设这是一个获取子集数据的方法 // 更新行数据或者展示子集 // 如果有子集数据,可以选择更新当前行的数据结构,展示子集;如果没有,直接返回 }; ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值