JDalri
JDalri

Reputation: 388

Vue-toastr and Vue2 how to set global options for toastr?

I'm using vue-toastr on my Laravel 5.5 and Vuejs 2 project.

The toasts are being showednormally, but I want to set some options globally for the toasts, like position...

I can't do this.

In my app.js file I've imported toastr from vue-toastr, required the styles and then Vue.component('vue-toastr', Toastr);.

I've tried this.$refs.toastr.defaultPosition = "toast-bottom-left" on my app.js like the docs say but it gives me an error Cannot read property 'toastr' of undefined

Any help?

Upvotes: 0

Views: 1663

Answers (1)

Bert
Bert

Reputation: 82459

As covered in the documentation:

Add component html: for vue 1.x

<vue-toastr v-ref:toastr></vue-toastr> 

Add component html: for vue 2.x

<vue-toastr ref="toastr"></vue-toastr>

Then you can use

this.$refs.toastr.defaultPosition = "toast-bottom-left"

Upvotes: 1

Related Questions