Vue&&TypeScript中是用mixins

混入 (mixins) 是一种分发 Vue 组件中可复用功能的非常灵活的方式。混入对象可以包含任意组件选项。

我们很多组件中需要用到一些公共的方法，就可以放到mixins中

Vue中是用mixins

/*eslint-disable*/
import { Component, Mixins } from 'vue-property-decorator'
import moment from 'moment'

/**
 * mixins
 */
@Component
class commonFnMixins extends Mixins() {
  /**
   * 格式化时间
   * @param time 时间戳
   * @param format 格式
   */
  formatTime = (time: number, format = 'YYYY-MM-DD HH:MM') => {
    if (!time) {
      return '-- --'
    }
    return moment(time).format(format)
  }

  /**
   * 格式化时长
   * @param time 时间戳
   * @param unit 单位
   */
  formatDuration = (time: number, unit = 1) => {
    if (!time) {
      return '00:00'
    }
    var minutes = Math.floor(time / 60 / unit)
    var seconds = Math.floor((time - minutes * 60 * unit) / unit)
    return (
      (minutes > 9 ? minutes : '0' + minutes) +
      ':' +
      (seconds > 9 ? seconds : '0' + seconds)
    )
  }
  /**
   * 设置网页title
   * @param title 标题
   */
  setDocumentTitle(title: string) {
    document.title = title
  }
  /**
   * 拼接歌手名
   * @param list
   */
  getArtist(list: any) {
    if (!list) {
      return ''
    }
    const names = list.map((item: any) => {
      return item.name
    })
    return names.join('/')
  }
}

export default commonFnMixins

具体使用：

import { Mixins } from 'vue-property-decorator'
import commonFnMixins from '@/utils/mixins'
export default class xxx extends Mixins(commonFnMixins)