【vue】mixin的使用

全局引入

mixin.js

export default {
  methods: {
    loadingTip(message) {
      this.$message.warning(message || "请求已发送！请勿频繁点击！");
    },
  },
};

main.js全局引入

import './mixin.js'

任意vue组件中使用
mixin里面的methods相当于插入到每个组件

this.loadingTip('mixin的methods的loadingTip方法')

单个vue组件使用mixins（局部使用）

var mixin = {
  methods: {
    foo: function () {
      console.log('foo')
    },
    conflicting: function () {
      console.log('from mixin')
    }
  }
}

var vm = new Vue({
  mixins: [mixin],
  methods: {
    bar: function () {
      console.log('bar')
    },
    conflicting: function () {
      console.log('from self')
    }
  }
})

详情点击查看官方文档