vue插件

  1. 一些辅助的东西和一些通用的方法可以放在helper这个文件下面,创建一个util.js文件

    image.png

  2. 在新建的js文件里封装好我们的过滤时间的方法:把时间取整并且在后面加上“单位”。记得将方法export导出来

function friendlyDate(dateStr) {
    let dateObj = typeof dateStr === 'object' ? dateStr : new Date(dateStr) //把dateStr变成对象或者日期对象
    let time = dateObj.getTime()
    let now = Date.now()
    let space = now - time
    let str = ''

    switch (true) {
        case space < 60000:
            str = '刚刚'
            break
        case space < 1000*3600:
            str = Math.floor(space/60000) + '分钟前'
            break
        case space < 1000*3600*24:
            str = Math.floor(space/(1000*3600)) + '小时前'
            break
        default: 
            str = Math.floor(space/(1000*3600*24)) + '天前'
    }
    return str
}

export default {
    install(Vue, options) {
        Vue.prototype.friendlyDate = friendlyDate
    }
}
  1. 在入口文件main.js文件中注册为全局插件
import 'element-ui/lib/theme-chalk/index.css';
import store from './store/index'
// 引入时间插件
import Util from './helpers/util' 
//注册为全局插件
Vue.use(Util)
  1. 应用


    image.png

你可能感兴趣的:(vue插件)