How to display Material-ui Alert based on the response of axios.post reactjs

Currently, using default alert which is alert(response.data.result). To make my site more beautiful, I want to use Material-ui Alert. https://material-ui.com/components/alert/

My issue is I have no idea on how to call it from const.

Here's my code.

function Test(){  const saveData=async() => {      await axios.post('/API', passedParams)      .then(response => {        if(response.data.success === true)          {            alert(response.data.result)          }        else          {            alert(response.data.result)            //<Alert severity='error'>{response.data.result}</Alert> tried to use this but nothing displayed            }       }).catch(error=>{          alert(error)       })    //content of modal  cosnt bodyInsert = (  <div>      ...fields      <Button onClick={()=>saveData()}>Save</Button>  </div>  )  return(  <div>  <Modal     open = {modalInsert}     onClose = {openCloseModalInsert}>     {bodyInsert}  </Modal>  </div>  )  }  export default Test;  

Hoping for your consideration. thank you.

https://stackoverflow.com/questions/66778316/how-to-display-material-ui-alert-based-on-the-response-of-axios-post-reactjs March 24, 2021 at 05:39PM