feat: add onClick props to Message component (#28131) (#28148)

* feat(message): add onClick method to Message component (#28131)

* feat(message):  remove unnecessary onClick method implementation

* test(message): update onClick test

* feat(message): add event parameter

components/message/__tests__/index.test.js

@@ -65,6 +65,27 @@ describe('message', () => {
     });
   });
 
+  it('trigger onClick method', () => {
+    const onClick = jest.fn();
+    class Test extends React.Component {
+      componentDidMount() {
+        message.info({
+          onClick: onClick,
+          duration: 0,
+          content: 'message info',
+        });
+      }
+
+      render() {
+        return <div>test message onClick method</div>;
+      }
+    }
+    mount(<Test />);
+    expect(document.querySelectorAll('.ant-message-notice').length).toBe(1);
+    document.querySelectorAll('.ant-message-notice')[0].click();
+    expect(onClick).toHaveBeenCalled();
+  });
+
   it('should be called like promise', done => {
     jest.useRealTimers();
     const defaultDuration = 3;

components/message/index.en-US.md

@@ -58,6 +58,7 @@ The properties of config are as follows:
 | key | The unique identifier of the Message | string \| number | - |
 | style | Customized inline style | [CSSProperties](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/e434515761b36830c3e58a970abf5186f005adac/types/react/index.d.ts#L794) | - |
 | onClose | Specify a function that will be called when the message is closed | function | - |
+| onClick | Specify a function that will be called when the message is clicked | function | - |
 
 ### Global static methods
 

components/message/index.tsx

@@ -129,6 +129,7 @@ export interface ArgsProps {
   key?: string | number;
   style?: React.CSSProperties;
   className?: string;
+  onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
 }
 
 function getRCNoticeProps(args: ArgsProps, prefixCls: string): NoticeContent {
@@ -150,6 +151,7 @@ function getRCNoticeProps(args: ArgsProps, prefixCls: string): NoticeContent {
       </div>
     ),
     onClose: args.onClose,
+    onClick: args.onClick,
   };
 }
 

components/message/index.zh-CN.md

@@ -59,6 +59,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/hAkKTIW0K/Message.svg
 | key | 当前提示的唯一标志 | string \| number | - |
 | style | 自定义内联样式 | [CSSProperties](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/e434515761b36830c3e58a970abf5186f005adac/types/react/index.d.ts#L794) | - |
 | onClose | 关闭时触发的回调函数 | function | - |
+| onClick | 点击 message 时触发的回调函数 | function | - |
 
 ### 全局方法