W
W
WebDev2018-06-15 12:24:13
Vue.js
WebDev, 2018-06-15 12:24:13

Is it possible to use mixin in different vue components?

Let's say I created a mixin.js file

module.exports = {
    manage: {
        data: function () {
            return {
                errorOnUpdate: false,
            }
        },
        methods: {
            update: function() {
                //some code
                if (error) {
                    this.errorOnUpdate = true;
                }
            }
        }
    },
};

Now I connect this file in several components through the mixins property.
If an error occurs in one component, will it be visible in another?
If not, then tell me how to properly organize such work:
I have a profile editing form with repeating elements that I put into a component so as not to duplicate the code.
The structure is like this:
/components
  /form
    /profile
      /contacts

And here I have the /form/profile/main.vue component on the page, which has data entry fields, but in addition, the /form/profie/contacts.vue component is substituted inside this component, which also has input fields.
In both main.vue and contacts.vue, the update method from the mixin is called on input, and everything is fine with that, but what about the error?

Answer the question

In order to leave comments, you need to log in

1 answer(s)
0
0xD34F, 2018-06-15
@kirill-93

If an error occurs in one component, will it be visible in another?
If not, please tell me how...

vuex
Transfer errorOnUpdate to the storage, and in the mixin make a computed property that gets errorOnUpdate and a method that will pull the mutation that changes the value of errorOnUpdate (or just replace the assignment with a mutation call in the update method, you know better here).

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question