How to make ant design alert in react js?

Solution

To make ant design alert in react js, first install ant design npm install antd and use in your code, use <Alert message="Success Text" type="success" />. it will make ant design alert in react js.

Snippet

In this snippet, we will use an alert component with a message of Success Text, a variant of Success, and a margin of 30 pixels.

<Alert message="Success Text" type="success"  style={{
      margin: '30px',
    }}/>

Example

In this example, we will import the alert from antd library, and use Alert component.

Let’s start coding…

App.js

import * as React from 'react';
import { Alert } from 'antd';


export default function ComboBox() {
  return (
 
    <Alert message="Success Text" type="success"  style={{
      margin: '30px',
    }}/>
  );
}

Output

Links

Here, we are provided code sandbox links for the above program make ant design alert in react js. Then you can use whenever you went and do the changes as per your requirements.

codesandbox

Happy Coding,

I hope the above example with help you to do your task.