当前位置: 首页 > news >正文

uniapp踩坑之项目:使用过滤器将时间格式化为特定格式

利用filters过滤器对数据直接进行格式化,注意:与method、onLoad、data同层级

<template><div><!-- orderInfo.time的数据为:2023-12-12 12:10:23 --><p>{{ orderInfo.time | formatDate }}</p> <!-- 2023-12-12 --><p>{{ orderInfo.time | formatTime }}</p> <!-- 12:10:23 --><p>{{ orderInfo.time | formatDateTime }}</p> <!-- 2023-12-12 12:10:23 --></div>
</template><script>
export default {data() {return {orderInfo: [],}},onLoad (options) {if (options.id) {let Id = options.idthis.接口({ Id }).then(res => {this.orderInfo = res.data.data})}},// 过滤器filters: {formatDate (value) {// ios部分机型无法识别版// const date = new Date(value);// return date.getFullYear()+'-'+(date.getMonth()+1)+'-'+date.getDate();// 兼容版if (value != undefined) {return value.substring(0, value.indexOf(' '))}},formatTime (value) {// ios部分机型无法识别版// const time = new Date(value);// return time.getHours() + ":" + time.getMinutes() + ":" + time.getSeconds();// 兼容版if (value != undefined) {const year = value.substr(0, 4); // 年const index = value.indexOf("-");const lastIndex = value.lastIndexOf("-");let interval = parseInt(lastIndex) - (parseInt(index) + 1); // 间隔const month = value.substr((parseInt(index) + 1), interval); // 月let space = value.indexOf(" "); // 空格interval = parseInt(space) - parseInt(lastIndex);const day = value.substr(parseInt(lastIndex) + 1, interval); // 日let colon = value.indexOf(":"); // 冒号interval = parseInt(colon) - (parseInt(space) + 1);const hour = value.substr(parseInt(space) + 1, interval);const colon2 = value.lastIndexOf(":");interval = parseInt(colon2) - (parseInt(colon) + 1);const minutes = value.substr(parseInt(colon) + 1, interval);const colon3 = value.lastIndexOf(":");const seconds = value.substr(parseInt(colon3) + 1);return hour + ":" + minutes + ":" + seconds; // 时分秒}},formatDateTime (value) {// ios部分机型无法识别版// const datetime = new Date(value);// const date = datetime.getFullYear()+'-'+(datetime.getMonth()+1)+'-'+datetime.getDate();// const time = datetime.getHours() + ":" + datetime.getMinutes() + ":" + datetime.getSeconds();// return date + ' ' + time;// 兼容版if (value != undefined) {const year = value.substr(0, 4); // 年const index = value.indexOf("-");const lastIndex = value.lastIndexOf("-");let interval = parseInt(lastIndex) - (parseInt(index) + 1); // 间隔const month = value.substr((parseInt(index) + 1), interval); // 月let space = value.indexOf(" "); // 空格interval = parseInt(space) - parseInt(lastIndex);const day = value.substr(parseInt(lastIndex) + 1, interval); // 日let colon = value.indexOf(":"); // 冒号interval = parseInt(colon) - (parseInt(space) + 1);const hour = value.substr(parseInt(space) + 1, interval);const colon2 = value.lastIndexOf(":");interval = parseInt(colon2) - (parseInt(colon) + 1);const minutes = value.substr(parseInt(colon) + 1, interval);const colon3 = value.lastIndexOf(":");const seconds = value.substr(parseInt(colon3) + 1);return year + "-" + month + "-" + day + hour + ":" + minutes + ":" + seconds; // 年月日时分秒}}}
}
</script>

上一篇文章, 

uniapp踩坑之项目:隐藏显示密码功能-CSDN博客文章浏览阅读398次。uniapp踩坑之项目:隐藏显示密码功能,1.input组件的password设置为动态前面加:冒号;2.动态切换眼睛图标使用:stylehttps://blog.csdn.net/weixin_43928112/article/details/134315684?spm=1001.2014.3001.5501

相关文章:

uniapp踩坑之项目:使用过滤器将时间格式化为特定格式

利用filters过滤器对数据直接进行格式化&#xff0c;注意&#xff1a;与method、onLoad、data同层级 <template><div><!-- orderInfo.time的数据为&#xff1a;2023-12-12 12:10:23 --><p>{{ orderInfo.time | formatDate }}</p> <!-- 2023-1…...

webpack学习-2.管理资源

webpack学习-2.管理资源 1.这章要干嘛2.加载css注意顺序&#xff01; 3.总结 1.这章要干嘛 管理资源&#xff0c;什么意思呢&#xff1f;管理什么资源&#xff1f;项目中经常会 导入各种各样的css文件&#xff0c;图片文件&#xff0c;字体文件&#xff0c;数据文件等等&#…...

658. 找到 K 个最接近的元素

658. 找到 K 个最接近的元素 Java代码&#xff1a;滑窗 class Solution {public List<Integer> findClosestElements(int[] arr, int k, int x) {List<Integer> list new ArrayList<>();for (int i 0; i < arr.length; i) {arr[i] arr[i] - x;}for(i…...

十二、MapReduce概述

1、MapReduce &#xff08;1&#xff09;采用框架 MapReduce是“分散——>汇总”模式的分布式计算框架&#xff0c;可供开发人员进行相应计算 &#xff08;2&#xff09;编程接口&#xff1a; ~Map ~Reduce 其中&#xff0c;Map功能接口提供了“分散”的功能&#xff…...

shell条件测试

目录 1.1.用途 1.2.基本语法 1.2.1.格式: 1.2.2.例 1.3 文件测试 1.4.整数测试 1.4.1.作用 1.4.2.操作符 1.4.3.示例&#xff1a; 1.5.逻辑操作符 1.5.1.符号 1.5.2.例&#xff1a; 1.6.命令分隔符 1.1.用途 为了能够正确处理Shell程序运行过程中遇到的各种情况&am…...

python在线读取传奇列表,并解析为需要的JSON格式

python在线读取传奇列表,并解析为需要的JSON格式,以下为传奇中使用的TXT列表格式, [Server] ; 使用“/”字符分开颜色,也可以不使用颜色,支持以前的旧格式,只有标题和服务器标题支持颜色 ; 标题/颜色代码(0-255)|服务器标题/颜色代码(0-255)|服务器名称|服务器IP|服务器端…...

【docker 】 安装docker(centOS7)

官网 docker官网 github源码 官网 在CentOS上安装Docker引擎 官网 在Debian上安装Docker引擎 官网 在 Fedora上安装Docker引擎 官网 在ubuntu上安装Docker引擎 官网 在RHEL (s390x)上安装Docker引擎 官网 在SLES上安装Docker引擎 最完善的资料都在官网。 卸载旧版本 …...

智能网联汽车场景数据图像标注要求及方法

智能网联汽车场景数据图像标注要求及方法 1 范围 本标准规定了智能网联汽车场景数据图像中交通参与者、交通信号灯、交通标志、交通标线、可行驶区域、光照条件、遮挡截断情况7类元素的标注要求及方法。 本标准适用于智能网联汽车图像数据标注。 2 规范性引…...

四. 基于环视Camera的BEV感知算法-BEVFormer

目标 前言0. 简述1. 算法动机&开创性思路2. 主体结构3. 损失函数4. 性能对比5. BEVFormerv2总结下载链接参考 前言 自动驾驶之心推出的《国内首个BVE感知全栈系列学习教程》&#xff0c;链接。记录下个人学习笔记&#xff0c;仅供自己参考 本次课程我们来学习下课程第四章—…...

gin投票系统3

对应视频v1版本 1.优化登陆接口 将同步改为异步 原login前端代码&#xff1a; <!doctype html> <html lang"en"> <head><meta charset"utf-8"><title>香香编程-投票项目</title> </head> <body> <m…...

windows如何解决端口冲突(实用篇)

在项目设计中&#xff0c;环境配置成功点击运行瞬间&#xff0c;一大堆红爆出&#xff0c;8080端口占用&#xff0c;这个是很烦人的。。。 解决方式&#xff1a; 笨方法&#xff1a;一、查看所有端口实用情况&#xff08;挨个扫&#xff09; 按住【WINR】快捷键打开运行输入…...

「PPT 下载」Google DevFest Keynote | 复杂的海外网络环境下,如何提升连接质量

&#xff08;全网都在找的《社交泛娱乐出海作战地图》&#xff0c;点击获取&#x1f446;&#xff09; 12 月 10 日&#xff0c;“Google DevFest 2023 上海站”大会如期在上海市东方万国宴会中心举办。延续过往的技术交流碰撞、前沿技术学习基调传统&#xff0c;本届大会聚焦行…...

Logstash输入Kafka输出Es配置

Logstash介绍 Logstash是一个开源的数据收集引擎&#xff0c;具有实时管道功能。它可以从各种数据源中动态地统一和标准化数据&#xff0c;并将其发送到你选择的目的地。Logstash的早期目标主要是用于收集日志&#xff0c;但现在的功能已经远远超出这个范围。任何事件类型都可…...

Bash脚本处理ogg、flac格式到mp3格式的批量转换

现在下载的许多音乐文件是flac和ogg格式的&#xff0c;QQ音乐上下载的就是这样的&#xff0c;这些文件尺寸比较大&#xff0c;在某些场合使用不便&#xff0c;比如在车机上播放还是mp3格式合适&#xff0c;音质这些在车机上播放足够了&#xff0c;要求不高。比如本人就喜欢下载…...

Android 依据Build相关信息判断机型

Android 依据Build相关信息判断机型 本文主要通过Build的相关信息获取机型,目前机型判断的较少,后续继续维护更新 public static String parseBuild() {StringBuilder sb new StringBuilder();String deriveFingerprint Build.FINGERPRINT;String manufacturer Build.MANU…...

2024年甘肃省职业院校技能大赛信息安全管理与评估赛项一阶段样题一

2024年甘肃省职业院校技能大赛高职学生组电子与信息大类信息安全管理与评估赛项样题一 竞赛需要完成三个阶段的任务&#xff0c;分别完成三个模块&#xff0c;总分共计 1000分。三个模块内容和分值分别是&#xff1a; 1.第一阶段&#xff1a;模块一 网络平台搭建与设备安全防…...

ARM:作业3

按键中断代码编写 代码: key_it.h #ifndef __KEY_IT_H__ #define __KEY_IT_H__#include "stm32mp1xx_gpio.h" #include "stm32mp1xx_exti.h" #include "stm32mp1xx_rcc.h" #include "stm32mp1xx_gic.h"void key1_it_config(); voi…...

基于OpenCV+CNN+IOT+微信小程序智能果实采摘指导系统——深度学习算法应用(含python、JS工程源码)+数据集+模型(二)

目录 前言总体设计系统整体结构图系统流程图 运行环境Python环境TensorFlow 环境Jupyter Notebook环境Pycharm 环境微信开发者工具OneNET云平台 相关其它博客工程源代码下载其它资料下载 前言 本项目基于Keras框架&#xff0c;引入CNN进行模型训练&#xff0c;采用Dropout梯度…...

*上位机的定义

上位机是指在分布式控制系统中&#xff0c;负责监控和控制下位机&#xff08;也称为远程终端设备&#xff09;的计算机或者计算机网络。它通常是一个高性能的计算设备&#xff0c;运行着特定的监控软件&#xff0c;用于实时监测、控制和管理下位机设备。 上位机负责与各个下位…...

架构LAMP

目录 1.什么是LAMP 2.LAMP组成及作用 3.搭建Apache httpd服务 4.编译安装mysqld 服务 5.编译安装PHP 解析环境 6.安装论坛 1.什么是LAMP LAMP架构是目前成熟的企业网站应用模式之一&#xff0c;指的是协同工作的一整套系统和相关软件&#xff0c;能够提供动态Web站点服务…...

进程地址空间(比特课总结)

一、进程地址空间 1. 环境变量 1 &#xff09;⽤户级环境变量与系统级环境变量 全局属性&#xff1a;环境变量具有全局属性&#xff0c;会被⼦进程继承。例如当bash启动⼦进程时&#xff0c;环 境变量会⾃动传递给⼦进程。 本地变量限制&#xff1a;本地变量只在当前进程(ba…...

Xshell远程连接Kali(默认 | 私钥)Note版

前言:xshell远程连接&#xff0c;私钥连接和常规默认连接 任务一 开启ssh服务 service ssh status //查看ssh服务状态 service ssh start //开启ssh服务 update-rc.d ssh enable //开启自启动ssh服务 任务二 修改配置文件 vi /etc/ssh/ssh_config //第一…...

如何在看板中体现优先级变化

在看板中有效体现优先级变化的关键措施包括&#xff1a;采用颜色或标签标识优先级、设置任务排序规则、使用独立的优先级列或泳道、结合自动化规则同步优先级变化、建立定期的优先级审查流程。其中&#xff0c;设置任务排序规则尤其重要&#xff0c;因为它让看板视觉上直观地体…...

无法与IP建立连接,未能下载VSCode服务器

如题&#xff0c;在远程连接服务器的时候突然遇到了这个提示。 查阅了一圈&#xff0c;发现是VSCode版本自动更新惹的祸&#xff01;&#xff01;&#xff01; 在VSCode的帮助->关于这里发现前几天VSCode自动更新了&#xff0c;我的版本号变成了1.100.3 才导致了远程连接出…...

STM32F4基本定时器使用和原理详解

STM32F4基本定时器使用和原理详解 前言如何确定定时器挂载在哪条时钟线上配置及使用方法参数配置PrescalerCounter ModeCounter Periodauto-reload preloadTrigger Event Selection 中断配置生成的代码及使用方法初始化代码基本定时器触发DCA或者ADC的代码讲解中断代码定时启动…...

基于Uniapp开发HarmonyOS 5.0旅游应用技术实践

一、技术选型背景 1.跨平台优势 Uniapp采用Vue.js框架&#xff0c;支持"一次开发&#xff0c;多端部署"&#xff0c;可同步生成HarmonyOS、iOS、Android等多平台应用。 2.鸿蒙特性融合 HarmonyOS 5.0的分布式能力与原子化服务&#xff0c;为旅游应用带来&#xf…...

Frozen-Flask :将 Flask 应用“冻结”为静态文件

Frozen-Flask 是一个用于将 Flask 应用“冻结”为静态文件的 Python 扩展。它的核心用途是&#xff1a;将一个 Flask Web 应用生成成纯静态 HTML 文件&#xff0c;从而可以部署到静态网站托管服务上&#xff0c;如 GitHub Pages、Netlify 或任何支持静态文件的网站服务器。 &am…...

【论文笔记】若干矿井粉尘检测算法概述

总的来说&#xff0c;传统机器学习、传统机器学习与深度学习的结合、LSTM等算法所需要的数据集来源于矿井传感器测量的粉尘浓度&#xff0c;通过建立回归模型来预测未来矿井的粉尘浓度。传统机器学习算法性能易受数据中极端值的影响。YOLO等计算机视觉算法所需要的数据集来源于…...

鸿蒙中用HarmonyOS SDK应用服务 HarmonyOS5开发一个医院查看报告小程序

一、开发环境准备 ​​工具安装​​&#xff1a; 下载安装DevEco Studio 4.0&#xff08;支持HarmonyOS 5&#xff09;配置HarmonyOS SDK 5.0确保Node.js版本≥14 ​​项目初始化​​&#xff1a; ohpm init harmony/hospital-report-app 二、核心功能模块实现 1. 报告列表…...

现代密码学 | 椭圆曲线密码学—附py代码

Elliptic Curve Cryptography 椭圆曲线密码学&#xff08;ECC&#xff09;是一种基于有限域上椭圆曲线数学特性的公钥加密技术。其核心原理涉及椭圆曲线的代数性质、离散对数问题以及有限域上的运算。 椭圆曲线密码学是多种数字签名算法的基础&#xff0c;例如椭圆曲线数字签…...