No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    notify plugin with click action

    Help
    2
    3
    274
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • s-light
      s-light last edited by

      Hello community,
      is there a possibility to add an click handler to a notify?

      this.$q.notify({
          color: 'negative',
          message: 'Hello World',
          icon: 'report_problem',
          onClick: this.handleTheNotifyClick
      })
      

      i like the visual appeareans / stacking of theme - but for the UI interaction it would be great to allow the user to just click on the popup and get directed to the correct sub page / paragrah what ever 😉

      if you have any tips or ideas please let me know!

      sunny greetings
      stefan

      Lurrik 1 Reply Last reply Reply Quote 0
      • Lurrik
        Lurrik @s-light last edited by Lurrik

        Hi @s-light,

        I made a remove item with the possibility to cancel before the remove ^^

        TEMPLATE

        <q-btn
             flat
             color="red"
             @click="removeAlerts"
             v-close-popup
            />
        

        SCRIPT

         methods: {
            removeAlerts() {
                  this.$q.notify({
                    progress: true,
                    message: "Item delete",
                    color: "red",
                    icon: "fa fa-trash", //with font awesome
                    actions: [
                      {
                        label: "Cancel",
                        color: "white",
                        handler: () => {
                          this.cancelRemove = false;
                        }
                      }
                    ]
                  });
            
                  setTimeout(() => {
                    if (this.cancelRemove) {
                      delete this.data[this.data.id];
                    }
                  }, 6000);
         
                  this.cancelRemove = true;
                }
        },
        1 Reply Last reply Reply Quote 1
        • s-light
          s-light last edited by

          thanks @Lurrik i will have a look what you are doing there the next days!

          sunny greetings
          stefan

          1 Reply Last reply Reply Quote 0
          • First post
            Last post