How to Display Toast Notifications in Salesforce Lightning Web Component



Lightning Web component(LWC) can send a toast notification that pops up to alert users of success, error, or warning. A toast provides simple feedback about an operation in a small popup. Lightning Web component can custom HTML elements built using HTML and modern JavaScript. To admins and end-users, they both appear as Lightning components.

We can style a toast to provide information, an error, a success, or a warning. It can remain visible for three seconds, until the user clicks to dismiss it, or a combination of both.

Toast Method

A component can send a toast notification that pops up to alert users of success, error, or warning.

To display a toast notification in Lightning Experience or Experience Builder sites, import ShowToastEvent from the lightning/platformShowToastEvent module.

Parameter Types

  1. Title
  2. Message
  3. Variant

Title

  • The title of the toast is displayed as a heading.
  • String type

Message

  • Contains the body of the message.
  • String type

Variant

  • Info – A gray box with an info icon. Default value
  • Success – A green box with a checkmark icon.
  • Warning – A yellow box with a warning icon.
  • Error – A red box with an error icon.

JavaScript Code

  • This is the JavaScript code to use the toasting method

Output

  • After clicking the Enter button automatically shows the success message

  • We can use different types of toast notification, just change the Variant type and this is the example

For more blogs: How to Setup Entitlement and Milestone in Salesforce

Reference from: click here