微信小程序wxml使用过滤器

news/2025/2/6 18:55:16/

微信小程序wxml使用过滤器

  • 1. 新建wxs
  • 2. 引用和使用

如何在微信小程序wxml使用过滤器?
犹如Angular使用pipe管道这样子方便,用的最多就是时间格式化。

下面是实现时间格式化的方法和步骤:

1. 新建wxs

在这里插入图片描述
插入代码:

/*** 管道过滤工具类* @param strDate * @param format */// 第一种方法:
var formatTime = function (strDate, format = "yyyy-MM-dd hh:mm:ss") {if(strDate==null || strDate ==undefined || strDate==""){return ""}// 解决ios出现NaN问题strDate = strDate.replace("T", " ");var realDate = strDate ? getDate(strDate.replace(getRegExp('-', 'g'), '/')) : getDate();var regYear = getRegExp("(y+)", "i");var date = [["M+", realDate.getMonth() + 1],["d+", realDate.getDate()],["h+", realDate.getHours()],["m+", realDate.getMinutes()],["s+", realDate.getSeconds()],["q+", Math.floor((realDate.getMonth() + 3) / 3)],["S+", realDate.getMilliseconds()],];var reg1 = regYear.exec(format);if (reg1) {format = format.replace(reg1[1], (realDate.getFullYear() + '').substring(4 - reg1[1].length));}for (var i = 0; i < date.length; i++) {var reg2 = getRegExp("(" + date[i][0] + ")").exec(format);if (reg2) {format = format.replace(reg2[1], reg2[1].length == 1 ? v : ("00" + date[i][1]).substring(("" + date[i][1]).length));}}return format;
}module.exports = {formatTime:formatTime
}

2. 引用和使用

wxml中使用

<wxs module="filter" src="../../utils/pipe.wxs"></wxs>
<view slot="title">
{{filter.formatTime(billingPeriodStart, 'yyyy-MM-dd')}} ~ {{filter.formatTime(billingPeriodEnd,'MM-dd')}}
</view>

http://www.ppmy.cn/news/1147825.html

相关文章

排序算法-选择排序法(SelectionSort)

排序算法-选择排序法&#xff08;SelectionSort&#xff09; 1、说明 选择排序法也是枚举法的应用&#xff0c;就是反复从未排序的数列中取出最小的元素&#xff0c;加入另一个数列中&#xff0c;最后的结果即为已排序的数列。选择排序法可使用两种方式排序&#xff0c;即在所…

MySQL中组合索引需要满足最左匹配原则?

文章目录 ChatGPT解读证明ChatGPT的结论总结 mysql的组合索引是KEY idx_nameagenumber ( name, age, number) USING BTREE SELECT * FROM lianhe_index where name小米 and age10 and number1000; SELECT * FROM lianhe_index where age10 and number1000; SELECT * FROM l…

2ED2410-EM:12v / 24v智能模拟高侧MOSFET栅极驱动器

概述 12v / 24v智能模拟高侧MOSFET栅极驱动器。 特性 PRO-SIL ISO 26262-准备根据ISO 26262:2018条款8-13支持硬件元件评估的集成商。一个通道器件具有两个高侧栅极驱动器输出。3 Ω下拉,50 Ω上拉,用于快速开关开/关。支持背靠背MOSFET拓扑(共漏极和共源)。两个双向高侧模拟…

深度学习自学笔记十三:unet网络详解和环境配置

一、unet网络详解 UNet&#xff08;全名为 U-Net&#xff09;是一种深度学习架构&#xff0c;最初由Olaf Ronneberger、Philipp Fischer和Thomas Brox于2015年提出&#xff0c;用于图像分割任务。该网络的名称来源于其U形状的架构&#xff0c;该架构使得网络在编码和解码过程中…

Vuex存值取值与异步请求处理

目录 前言 一、Vuex简介 1.Vuex是什么 2.Vuex的核心概念 3.使用Vuex的好处 4.Vuex执行流程 二、Vuex的使用步骤 1.安装Vuex 2.创建store模块&#xff0c;分别维护state/actions/mutations/getters 3.使用Vuex存储值&#xff0c;获取值和改变值 1.state.js---存值 2.…

js为什么是单线程?

基础 js为什么是单线程&#xff1f; 多线程问题 类比操作系统&#xff0c;多线程问题有&#xff1a; 单一资源多线程抢占&#xff0c;引起死锁问题&#xff1b;线程间同步数据问题&#xff1b; 总结 为了简单&#xff1a; 更简单的dom渲染。js可以操控dom&#xff0c;而一…

NginxWebUI runCmd 远程命令执行漏洞复现 [附POC]

文章目录 NginxWebUI runCmd 远程命令执行漏洞复现 [附POC]0x01 前言0x02 漏洞描述0x03 影响版本0x04 漏洞环境0x05 漏洞复现1.访问漏洞环境2.构造POC3.复现 0x06 修复建议 NginxWebUI runCmd 远程命令执行漏洞复现 [附POC] 0x01 前言 免责声明&#xff1a;请勿利用文章内的相…

SparseBEV:High-Performance Sparse 3D Object Detection from Multi-Camera Videos

参考代码&#xff1a;SparseBEV 动机与主要贡献&#xff1a; BEV感知可以按照是否显式构建BEV特征进行划分&#xff0c;显式构建BEV特征的方法需要额外计算量用于特征构建&#xff0c;而类似query方案的方法则不需要这样做。比较两种类型的方法&#xff0c;前者需要更多计算资…