Home > Blockchain >  How to add onClick event on antd message?
How to add onClick event on antd message?

Time:08-12

I have following question and I hope you can help me.

I have this code:

 const [msgTimer, setMsgTimer] = useState(5);

 message.error('some error msg', msgTimer);

In antd documentation message has onClick property. So how can I add that onClick event to my message?

I tried following but it not working.

 message.error('some error msg', msgTimer, onClick={()=>setMsgTimer(0)});

With that onClick I want immediately close that message.

Please help me to resolve this problem.

CodePudding user response:

What you want to achieve is possible, but you'll need to use a different syntax, that allows you to set a key for a message.

const messageKey = 'some unique message key';
message.error({
  content: 'some error msg',
  duration: 5,
  key: messageKey,
  onClick: () => message.destroy(messageKey)
});

This way, you'll assign a unique key to the message, that you can later use in your onClick handler to remove that message.

  • Related