vue全局的mixin使用和局部mixin使用

局部使用mixin
官方解释： https://cn.vuejs.org/v2/guide/mixins.html

1. 定义一个 js 文件(mixin.js)

export default {
data() {
  return {
   name: 'mixin'
  }
},
created() {
  console.log('mixin...', this.name);
},
mounted() {},
methods: {}
}

2.在vue文件中使用mixin

import mixin from '@/mixin'; // 引入mixin文件
export default {
    mixins: [mixin]
}

全局使用mixin
step1: 先定义mixin.js

const mixin = {
  methods: {
    /**
     * 格式化时间
     * @param {string|number|object|Array} dateTime - 时间，可以是一个字符串、时间戳、表示时间的对象、Date对象或者******表示时间的数组
     * @param {string} [fmt] - 格式
     * @returns {string} 返回格式化后的日期时间，默认格式：2018年1月11日 15:00
     * @see [momentjs]{@tutorial http://momentjs.cn/}
     */
    formatDate (dateTime, fmt = 'YYYY年M月DD日 HH:mm:ss') {
      if (!dateTime) {
        return ''
      }
      moment.locale('zh-CN')
      dateTime = moment(dateTime).format(fmt)
      return dateTime
    }
  }
}
export {
    mixin
}

step2：在main.js文件里面注册mixin

import mixin from './mixin'

Vue.mixin(mixin)

step3：在你的vue文件里面就可以使用mixin里面定义好的东西比如

data() {
    return {
      userName: "等你",
      time: this.formatDate(new Date()),
      arr: [1,2,3,4,5,'文字'],
      result: []
    }
  }

加粗样式