广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >微信小程序实现日期格式化
  • 797
分享到

微信小程序实现日期格式化

2024-04-02 19:04:59 797人浏览 独家记忆
摘要

最近做了一个微信小程序的项目,关于后端给我传递日期的时候,我拿到的是一串数字如:createDate: 1552117531000 ,这是一个列的创建时间,现在却变成了一串数字,这是

最近做了一个微信小程序项目,关于后端给我传递日期的时候,我拿到的是一串数字如:createDate: 1552117531000 ,这是一个列的创建时间,现在却变成了一串数字,这是怎么回事?其实这串数字是1970年到现在的一个毫秒数,那怎么把这个毫秒数格式化成为日期呢?接下来就是我们该做的事情了。

1.先看一下没有格式化之前的写法

js

tapPaying: function (options) {
  //封装过的访问路径
    orderapi.userOrder({ status: "wait", merchant: wx.getStorageSync('user').mId }).then((res) => {
    //查询成功后返回的数据
      console.log(res.data.content)
      this.setData({
        waitOrder: res.data.content
      })
    }).catch((err) => {
      console.log(err)
    })
  },

wxml

<view class="name" wx:for="{{waitOrder}}" wx:for-key="index" wx:for-item="ev">
   {{ev.createDate}}
</view>

查询结果

2.现在使用日期格式化

1.现在js页面写日期格式转换的方法

dateFORMat(date, fmt) { // author: meizz
    var o = {
      'M+': date.getMonth() + 1, // 月份
      'd+': date.getDate(), // 日
      'H+': date.getHours(), // 小时
      'm+': date.getMinutes(), // 分
      's+': date.getSeconds(), // 秒
      'q+': Math.floor((date.getMonth() + 3) / 3), // 季度
      S: date.getMilliseconds() // 毫秒
    }
    if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length))
    for (var k in o) { if (new RegExp('(' + k + ')').test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length))) }
    return fmt
  },

2.在js中,返回查询结果中调用此方法

tapPaying: function (options) {
    orderApi.userOrder({ status: "wait", merchant: wx.getStorageSync('user').mId }).then((res) => {
      console.log(res.data.content)
      let waitOrder = res.data.content
      //格式化日期
      waitOrder.map((item) => {
        if (item.createDate) item.createDate = this.dateFormat(new Date(item.createDate), 'yyyy-MM-dd HH:mm:ss')
      })
      this.setData({
        waitOrder
      })
    }).catch((err) => {
      console.log(err)
    })
  },

3.wxml不做任何修改,重新编译,然后查看

到此日期已经格式化完成

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程网。

--结束END--

本文标题: 微信小程序实现日期格式化

本文链接: https://www.lsjlt.com/news/153129.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 微信小程序实现日期格式化
    最近做了一个微信小程序的项目,关于后端给我传递日期的时候,我拿到的是一串数字如:createDate: 1552117531000 ,这是一个列的创建时间,现在却变成了一串数字,这是...
    99+
    2022-11-13
  • 微信小程序实现日期范围选择
    本文实例为大家分享了微信小程序实现日期范围选择的具体代码,供大家参考,具体内容如下 样式如下: 分别点击开始日期和结束日期选择时间(底部弹框): date.wxml:  <...
    99+
    2022-11-13
  • 微信小程序实现日期时间筛选器
    开发微信小程序过程中,有个需求需要用到日期时间筛选器,查看微信官方文档后,发现官方文档的picker筛选器只能单独支持日期或者是时间,所以为了实现需求自己参考企业微信封装了个日期时间...
    99+
    2022-11-13
  • 微信小程序如何实现日期时分组件
    这篇文章主要介绍了微信小程序如何实现日期时分组件,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。如图所示效果第一步新建picker组件文件1,pickerTime.js组件代码...
    99+
    2023-06-25
  • 在微信小程序使用picker实现日期选择
    微信小程序开发项目中,或多或少要使用时间选择器picker实现日期选择。选择开始日期和结束日期 而且选择开始时间后,选择结束时间,能够选择的日期不能比开始日期还要早。要实现以上效果可这样写: 在wxml中写 ...
    99+
    2023-08-25
    微信小程序 小程序 前端
  • 微信小程序如何实现日期范围选择
    本篇内容介绍了“微信小程序如何实现日期范围选择”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!样式如下:分别点击开始日期和结束日期选择时间(底...
    99+
    2023-07-02
  • 实现微信小程序中的日期选择器效果
    随着微信小程序的广泛应用,越来越多的开发者需要实现日期选择器效果来提高用户体验。本文将介绍如何在微信小程序中实现日期选择器效果,并给出具体的代码示例。一、实现思路实现日期选择器效果的基本思路是:首先在 WXML 中建立日期选择器组件,通过 ...
    99+
    2023-11-21
    微信小程序 实现 日期选择器
  • 微信小程序实现根据日期和时间排序功能
    最近接手了一个小程序的项目,有这样一个需求要对列表进行日期和时间的排序,于是小试牛刀,操作了一番,终于搞出来,在这里给大家总结分享一下经验,希望对大家有一定的帮助。 需求分析(这是已...
    99+
    2022-11-12
  • 微信小程序格式化方法怎么用
    这篇文章主要介绍了微信小程序格式化方法怎么用的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇微信小程序格式化方法怎么用文章都会有所收获,下面我们一起来看看吧。util.js这段代码包含3个段落,按照参照关系逐一说...
    99+
    2023-06-19
  • 微信小程序wxs日期时间处理的实现示例
    目录1、时间戳转日期2、UTC转北京时间WXS(WeiXin Script)是小程序的一套脚本语言,wxs 与 javascript 是不同的语言,有自己的语法,并不和 javasc...
    99+
    2022-11-12
  • 微信小程序实现日历打卡
    本文实例为大家分享了微信小程序实现日历打卡的具体代码,供大家参考,具体内容如下 样式比较简单,要改自己改 let currentMonthDays = new Date(year,...
    99+
    2022-11-13
  • 微信小程序自定义日期选择器
    日期选择器是我们在写项目的过程中经常遇到的,有需要标题的选择器,也有不需要标题的选择器 今天给大家带来一个自定义的时间选择器,废话不多说,直接上代码 第一步:先创建一个picker的...
    99+
    2022-11-12
  • @JsonFormat 实现日期格式自动格式化
    目录@JsonFormat 日期格式自动格式化例如,某个类里面有个属性@JsonFormat时间格式化注解使用@JsonFormat注解是一个时间格式化注解@JsonFormat 日...
    99+
    2022-11-12
  • 微信小程序日期时分组件(年月日时分)
    本文实例为大家分享了微信小程序日期时分组件的具体代码,供大家参考,具体内容如下 如图所示效果 第一步新建picker组件文件 1,pickerTime.js组件代码内容 // ...
    99+
    2022-11-12
  • 微信小程序如何实现九宫格
    这篇文章将为大家详细讲解有关微信小程序如何实现九宫格,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。微信小程序 九宫格实现效果图:小程序是长在微信上的,是移动端的界面,为了...
    99+
    2022-10-19
  • 微信小程序实现九宫格效果
    本文实例为大家分享了微信小程序实现九宫格效果的具体代码,供大家参考,具体内容如下 1.九宫格实现示例图: Tips: 说明: 使用 display: -webkit-flex;对...
    99+
    2022-11-12
  • 微信小程序怎么实现九宫格
    这篇文章主要介绍“微信小程序怎么实现九宫格”,在日常操作中,相信很多人在微信小程序怎么实现九宫格问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”微信小程序怎么实现九宫格”的疑惑有所帮助!接下来,请跟着小编一起来...
    99+
    2023-06-26
  • 微信小程序日期选择器使用详解
    本文实例为大家分享了微信小程序日期选择器的具体代码,供大家参考,具体内容如下 需求:在小程序开发中,时常会遇到日期选择器、时间选择器或者地区选择器来进行选择的功能。往往设计图上面并不...
    99+
    2022-11-13
  • 微信小程序日期选择器如何使用
    本文小编为大家详细介绍“微信小程序日期选择器如何使用”,内容详细,步骤清晰,细节处理妥当,希望这篇“微信小程序日期选择器如何使用”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。需求:在小程序开发中,时常会遇到日期选...
    99+
    2023-07-02
  • 微信小程序中日历/日期选择插件怎么用
    这篇文章给大家分享的是有关微信小程序中日历/日期选择插件怎么用的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。具体内容如下wxml<view class="...
    99+
    2022-10-19
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作