Ant Design:Modal模态对话框组件封装

简介: Ant Design:Modal模态对话框组件封装

需要的动态变更的部分有


1.Modal对话框的title标题

2.Modal对话框的子元素内容

3.确认按钮的事件函数


import { Modal } from 'antd';
import { useState } from 'react';
const App = ({ title, content, submitFunction, thisStatus }) => {
  const [status, setStatus] = useState(thisStatus);
  return (
    <>
      <Modal
        title={title}
        onOk={submitFunction}
        onCancel={() => {
          setStatus(false);
        }}
        visible={status}
      >
        {content}
      </Modal>
    </>
  );
};
export default App;

相关文章
|
6月前
|
前端开发
修改Ant Design 按钮的样式
修改Ant Design 按钮的样式
165 0
|
10月前
ant design pro 面包屑和多标签页
ant design pro 面包屑和多标签页
327 0
|
9月前
|
前端开发
ant design封装一个弹框组件
ant design封装一个弹框组件
79 0
|
6天前
Ant Design组件动态嵌套表单制作
Ant Design组件动态嵌套表单制作
138 0
|
6月前
Ant design组件库里面的Dropdown怎么写点击事件?
Ant design组件库里面的Dropdown怎么写点击事件?
|
9月前
|
前端开发
ant design锚点组件
ant design锚点组件
57 0
|
9月前
|
前端开发 JavaScript
重置ant design得样式
重置ant design得样式
54 0
|
9月前
|
索引
Ant Design:表格自定义渲染
Ant Design:表格自定义渲染
|
9月前
Ant Design:Form表单组件的正确使用
Ant Design:Form表单组件的正确使用
|
10月前
|
JavaScript 编译器
【Vue】利用v-model特性封装Dialog弹窗或可编辑窗口。
【Vue】利用v-model特性封装Dialog弹窗或可编辑窗口。