Action done message, toast in Vue 3 with Oruga UI

- Andrés Cruz

En español

Action done message, toast in Vue 3 with Oruga UI

Another very interesting component that we have at our disposal is that of displaying a toast-type message; for that we have the function:

this.$oruga.notification.open

Which receives as parameters:

  • message, The message.
  • position, The position that can be: top-right toptop-left bottom-right bottom bottom-left
  • variant, The variant that can be: primary info warning danger
  • duration, The duration expressed in thousandths of a second.
  • closable, and whether it can be closed by clicking.

For example:

this.$oruga.notification.open({
        message: "Registro eliminado",
        position: "bottom-right",
        variant: "danger",
        duration: 4000,
        closable: true,
});

Or to save:

this.$oruga.notification.open({
   message: "Registro procesado con éxito",
   position: "bottom-right",
   duration: 4000,
   closable: true,
});

I agree to receive announcements of interest about this Blog.

We will see how to create a toast message using a Vue plugin.

- Andrés Cruz

En español

Vue
) )