Problems when using with vuex

[AndaHendriksen]

I'm submitting a ...

[x] Bug report => search github for a similar issue or PR before submitting
[ ] Feature request
[ ] Other, please describe

Tell about your platform

• Vue.js version : 3.2.12
• Browser name and version : Edge 94.0.992.47
• This package version : 2.0.1

Current behavior
I get an error when when calling

VueToast.success('Success');
`Uncaught (in promise) Error: TypeError: vue_toast_notification__WEBPACK_IMPORTED_MODULE_6___default.a.success is not a function`

I get an error when calling this.$toast.success('Success!');
Uncaught (in promise) Error: TypeError: Cannot read properties of undefined (reading 'success')

Expected behavior
I would get the toast notification popup with success message.

Minimal reproduction of the problem with instructions
STEPS TO REPRODUCE

import { createStore } from 'vuex';
import axios from 'axios';
import VueToast from 'vue-toast-notification';

export default createStore({
  ...
  actions: {
    async update({ commit }, data) {
      return new Promise((resolve, reject) => {
        axios.put(...)
          .then((response) => {
            if (response.status === 200 || response.status === 201) {

              VueToast.success('Success!'); <-- gives error
              this.$toast.success('Success!'); <-- gives error

              resolve(response.data);
            }
    
            if (response.status === 404) {
              ...
            }
    
            return null;
          })
          .catch((error) => reject(...));
      });
    },
  },
  ...
});

[ankurk91]

I have not tried this package with a combination of vue 3 and vuex yet.

I will debug this soon

[ankurk91]

You can not access vue instance in store like this,
Here is the link for vue.js 2
https://stackoverflow.com/questions/60491988/how-to-access-vue-instance-in-vuex

Your example does not have lines regarding the createApp() and app.use(VueToast)

I would suggest to try this package without vuex first. If you get success then find a solution to use app instance inside vuex store.

[AndaHendriksen]

Okay I will get around it another way.

But thanks for looking into it so fast @ankurk91! Really appreciate it.

[ankurk91]

You can use composition api now with v3.x

import {useToast} from "vue-toast-notification";