Mixin not working Vue.js - Error: {method} refrenced but not defined

Question

I have a mixin in my Vue project. But, it's not working. Here's the code:

InvMixin.js

export default {
    created() {
        console.log("hi");
    },

    methods: {
        helloa() {
            console.log('hi from mixin');
        },
        proal() {
            console.log("hoye");
        }
    }
}

template

import invMixin from "./InventoryMixin.js";
export default {

  mixins: [invMixin],

 methods: {
        check() {
            this.helloa();
        }
    }
}

Output

helloa is referenced but not defined Created of mixin not working

Can someone help to solve it, please? Thankyou!!

please share a bit more of template.vue, specifically between the import and the methods — depperm
– depperm, Commented Feb 3, 2020 at 19:40
which is the real name of the mixin ? InventoryMixin or invMixin, try using only one — Christian Carrillo
– Christian Carrillo, Commented Feb 4, 2020 at 2:54
Is path of InventoryMixin.js is correct ? Just asking to be clear. — Nipun Jain
– Nipun Jain, Commented Feb 4, 2020 at 7:32
This should work perfecly well except the code you posted isn't the same you're using. The only case I had that is simmilar to yours is when I accidently placed the mixins:[] inside of a prop which threw no errors. — Hexodus
– Hexodus, Commented Feb 17, 2021 at 11:23

Serg · Accepted Answer · 2020-02-03 20:01:21Z

2

Just importing your mixin is not enough. Declare it in your component:

// In your component
import invMixin from "./InventoryMixin.js";

export default {
  name: "MyComponent",
  mixins: [invMixin] //declare mixin here
}

answered Feb 3, 2020 at 20:01

Serg

8457 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

ashfixed Over a year ago

Done, still the same

Serg Over a year ago

@idk there are any differences between imvMixin.js and InventoryMixin.js? And schow the complete component where you are using the mixin

Collectives™ on Stack Overflow

Mixin not working Vue.js - Error: {method} refrenced but not defined

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related