[Vuejs]-How to extend app.js methods/data/watch from laravel blade view file without creating components

0๐Ÿ‘

โœ…

Iโ€™ve found a solution!

Use Mixin

Create mixin.js file besides app.js

For example

export var custom = {
  data: {
    show: true
  },
  methods: {
    hide: function(){
      this.show = false;
    }
  },
  watch: {
    ...
  },

  ...

};

and, in app.js file:

import { store } from './store';
import { custom } from './mixin';  //Import mixin
window.app = new Vue({
    el: '#app',
    mixins: [custom],  // Add mixin var here
    store,
});

/*
  [note: for multiple: import {custom1, custom2, ...} and define [custom1, custom2, ...] ]
*/

More details: Official Documentation

Leave a comment