[SOLVED] Unable to create compo:Toast but Alert works fine

[quem]

Hello there, new to Quasar and I find it awesome !

I am not able to create a basic Toast which is odd.

• Created a fresh quasar repo
• Edited “src/components/Hello.vue”
  – Import { […], Toast } from ‘quasar’
  – Added in the mounted () method the following :
  Toast.create(‘Hello World’) or Toast.create({ html: ‘Hello World’ })

Nothing appears and the vue developer tool (chrome) doesn’t show anything in Vue instance Root …
There is no error in the console.

I noticed that Alert({ html: ‘Hello World’ }) worked fine.

So my question is : is there something I should specify (e.g in the Layout ?) so Toast appears ? I didn’t find anything in the documentation.
Thanks for your help

[benoitranque]

There is no need to specify anything extra for Toast to show up. I think the problem is the mounted function, I’m not sure. Try:

<template>
  <div>
    <q-btn @click="met()">Hi</q-btn>
  </div>
</template>

<script>
  import { Toast, QBtn } from 'quasar'
  export default {
    name: 'DataPoint',
    components: {
      QBtn
    },
    methods: {
      met () {
        Toast.create('hello')
      }
    }
  }
</script>

If this works, the problem is the mounted function. I think you could use:

    mounted () {
      process.nextTick(() => {
        Toast.create('Hello')
      })
    }

edit: code corrected as per post below

[quem]

Thanks for the help. Indeed, calling Toast.create in mounted() breaks somehow the component and cannot be used elsewhere afterward.

The above solution works (corrected, use “process.nextTick”)

mounted() {
  process.nextTick(() => {
    Toast.create('Hello World')
  }
}

Isn’t there a more elegant solution ?
When the component is called, I want to perform some checks and display a Toast if needed. I thought mounted() was the good call.
I know, this question is more about VueJS than quasar finally.

[benoitranque]

I’m pretty sure this has to do with the dom not being ready during mounted. Or something along those lines. (checked: the dom should be ready during mounted)

Still looks like a bug to me, and if so will be fixed after v0.15 is out.

In the meantime you should be fine with your checks during mounted, but use nextTick for Toast