uniapp 格式化时间刚刚,几分钟前,几小时前,几天前…

效果如图:

根目录下新建utils文件夹,文件夹下新增js文件,文件内容:

export const filters = {dateTimeSub(data) {if (data == undefined) {return;}// 传进来的data必须是日期格式,不能是时间戳//将字符串转换成时间格式var timePublish = new Date(data);var timeNow = new Date();var minute = 1000 * 60;var hour = minute * 60;var day = hour * 24;var month = day * 30;var result = "";var diffValue = timeNow - timePublish;  //时间差var diffMonth = diffValue / month;      //月差var diffWeek = diffValue / (7 * day);   //周差var diffDay = diffValue / day;          //天差var diffHour = diffValue / hour;        //时差var diffMinute = diffValue / minute;    //分差if (diffValue < 0) {console.log("错误时间");} else if (diffMonth > 3) {// result = timePublish.getFullYear() + "-";// result += timePublish.getMonth() + "-";// result += timePublish.getDate();// console.log(result);} else if (diffMonth > 1) {// result = parseInt(diffMonth) + "月前";} else if (diffWeek > 1) {// result = parseInt(diffWeek) + "周前";} else if (diffDay > 3) {let y = timePublish.getFullYear();let MM = timePublish.getMonth() + 1;MM = MM < 10 ? ('0' + MM) : MM; //月补0let d = timePublish.getDate();d = d < 10 ? ('0' + d) : d; //天补0result = y + '-' + MM + '-' + d;} else if (diffDay>=1 && diffDay <= 3) {result = parseInt(diffDay) + "天前";} else if (diffHour > 1) {result = parseInt(diffHour) + "小时前";} else if (diffMinute > 1) {result = parseInt(diffMinute) + "分钟前";} else {result = "刚刚";}return result;},formatDate(value) {if (value == undefined) {return;}// #ifdef APP-PLUSif(plus.os.name == 'iOS') {time = time.replaceAll("-", "/")}// #endif// let date = new Date(value * 1000);let date = new Date(value);//时间戳为10位需*1000,时间戳为13位的话不需乘1000let y = date.getFullYear();let MM = date.getMonth() + 1;MM = MM < 10 ? ('0' + MM) : MM; //月补0let d = date.getDate();d = d < 10 ? ('0' + d) : d; //天补0let h = date.getHours();h = h < 10 ? ('0' + h) : h; //小时补0let m = date.getMinutes();m = m < 10 ? ('0' + m) : m; //分钟补0let s = date.getSeconds();s = s < 10 ? ('0' + s) : s; //秒补0return y + '-' + MM + '-' + d; //年月日// return y + '-' + MM + '-' + d + ' ' + h + ':' + m+ ':' + s; //年月日时分秒},formatTime(value) {if (value == undefined) {return;}// #ifdef APP-PLUSif(plus.os.name == 'iOS') {time = time.replaceAll("-", "/")}// #endiflet date = new Date(value);let MM = date.getMonth() + 1;MM = MM < 10 ? ('0' + MM) : MM; //月补0let d = date.getDate();d = d < 10 ? ('0' + d) : d; //天补0return  MM + '月' + d + '日'; //年月日}
}

 main.js中引入

import Vue from 'vue'Vue.config.productionTip = falseimport { filters } from './utils/time_day.js'
// 定义全局自定义过滤器
Object.keys(filters).forEach(key => {Vue.filter(key, filters[key])
})

页面中使用即可

<view class="times">{{item.updatetime | getDateDiff}}</view>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/61763.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

机器学习深度学习——序列模型(NLP启动!)

&#x1f468;‍&#x1f393;作者简介&#xff1a;一位即将上大四&#xff0c;正专攻机器学习的保研er &#x1f30c;上期文章&#xff1a;机器学习&&深度学习——卷积神经网络&#xff08;LeNet&#xff09; &#x1f4da;订阅专栏&#xff1a;机器学习&&深度…

vue消息订阅与发布,实现任意组件间通讯

第一步&#xff1a;下载第三方消息订阅与发布库&#xff0c;例如常用的pubsub.js,他可以在任何框架中使用包括vue、react、anglar等等。 命令&#xff1a;npm i pubsub-js 注意是pubsub-js(不是点); 第二步&#xff1a;引入库&#xff1b; import pubsub from pubsub-js 第…

Die2Die(D2D)和chip2chip(C2C)之间的高速互联接口

随着chiplet的兴起&#xff0c;Die2Die的高速互联越来越重要&#xff0c;相比于传统的C2C(chip2chip)的互联&#xff0c;D2D的片间距离很近(10mm量级)&#xff0c;且这些小的chip(裸片)最终形成一个封装【多芯片模块&#xff08;MCM&#xff09;】。所以D2D的互联信道短&#x…

修改Egohands公开数据集,用于YOLOv5训练通用手部检测模型

〇、背景&#xff1a; 项目需要&#xff0c;需要利用摄像头对人手进行实时监测&#xff0c;最先考虑到的就是简单易用且高效的YOLOv5&#xff0c;很快找到了公开数据集&#xff1a;Egohands EgoHands: A Dataset for Hands in Complex Egocentric Interactions | IU Computer…

【人工智能前沿弄潮】—— SAM系列:SAM从提示生成物体mask

SAM从提示生成物体mask Segment Anything Model&#xff08;SAM&#xff09;根据指示所需的对象来预测对象掩码。该模型首先将图像转换为图像嵌入&#xff0c;从而可以从提示中高效地生成高质量的掩码。 SamPredictor类为模型提供了一个简单的接口来提示模型。用户可以首先使…

数据结构日记之《队列的定义》

队列的定义 一、队列的定义和特点二、队列的抽象数据类型定义三、例子 一、队列的定义和特点 队列 (queue) 是一种 先进先出(First In First Out, FIFO) 的线性表。它只允许在表的一端进行插入&#xff0c;而在另一端删除元素。这和日常生活中的排队是一致的&#xff0c;最早进…

uniapp+vue3项目中使用vant-weapp

创建项目 通过vue-cli命令行创建项目 Vue3/Vite版要求 node 版本^14.18.0 || >16.0.0 uni-app官网 (dcloud.net.cn) npx degit dcloudio/uni-preset-vue#vite my-vue3-project打开项目 点击顶部菜单栏终端/新建终端 执行安装依赖指令 yarn install 或 npm install 安装vant…

【uniapp】使用Vs Code开发uniapp:

文章目录 一、使用命令行创建uniapp项目&#xff1a;二、安装插件与配置&#xff1a;三、编译和运行:四、修改pinia&#xff1a; 一、使用命令行创建uniapp项目&#xff1a; 二、安装插件与配置&#xff1a; 三、编译和运行: 该项目下的dist》dev》mp-weixin文件导入微信开发者…

Redisson可重入锁原理

微信公众号访问地址&#xff1a;Redisson可重入锁原理 推荐文章&#xff1a; 1、使用原生Redis命令实现分布式锁 ​ 2、为什么引入Redisson分布式锁&#xff1f; 3、SpringBoot整合多数据源&#xff0c;并支持动态新增与切换&#xff08;详细教程&#xff09; 4、SpringBo…

3D Web轻量化引擎HOOPS Communicator如何实现对BIM桌面端的支持?

HOOPS Communicator是一款简单而强大的工业级高性能3D Web轻量化渲染开发包&#xff0c;其主要应用于Web领域&#xff0c;主要加载其专有的SCS、SC、SCZ格式文件&#xff1b;HOOPS还拥有另一个桌面端开发包HOOPS Visualize&#xff0c;主要加载HSF、HMF轻量化格式文件。两者虽然…

【QPSK信号生成】生成正交相移键控信号研究(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…

Kubernetes集群部署(第二篇)

安装flannel Master 节点NotReady 的原因就是因为没有使用任何的网络插件&#xff0c;此时Node 和Master的连接还不正常。目前最流行的Kubernetes 网络插件有Flannel、Calico、Canal、Weave 这里选择使用flannel。 flannel提取链接&#xff1a;https://pan.baidu.com/s/1fLJKh…