在微信小程序wxml文件調用函數實現時間轉換---使用wxs模塊實現

1. 創建 WXS 模塊文件(推薦單獨存放)

在項目目錄下新建 utils.wxs 文件,編寫時間轉換邏輯:

// utils.wxs
module.exports = {// 將毫秒轉換為分鐘(保留1位小數)convertToMinutes: function(ms) {if (typeof ms !== 'number') return '0.0'return (Math.round(ms / 60000 * 10) / 10).toFixed(1)},// 將秒轉換為分鐘(保留1位小數)convertSecondsToMinutes: function(seconds) {if (typeof seconds !== 'number') return '0.0'return (Math.round(seconds / 60 * 10) / 10).toFixed(1)}
}

2. 在 WXML 中引入 WXS 模塊

在需要使用的 WXML 文件中,通過 標簽引入模塊:

<!-- 頁面.wxml -->
<wxs src="../../utils.wxs" module="timeUtils" /><!-- 示例:顯示轉換結果 -->
<view><!-- 轉換毫秒(如 90000ms = 1.5分鐘) --><text>90000ms = {{timeUtils.convertToMinutes(90000)}}分鐘</text><!-- 轉換秒(如 150= 2.5分鐘) --><text>150= {{timeUtils.convertSecondsToMinutes(150)}}分鐘</text>
</view>

3. 直接內聯 WXS 代碼(可選)

如果不想單獨創建文件,也可以直接在 WXML 中內聯 WXS:

<wxs module="timeUtils">module.exports = {convertToMinutes: function(ms) {if (typeof ms !== 'number') return '0.0'return (Math.round(ms / 60000 * 10) / 10).toFixed(1)}}
</wxs><!-- 調用方式相同 -->
<text>{{timeUtils.convertToMinutes(120000)}}</text>

4. 動態數據綁定(結合 JS)

如果需要轉換動態數據,在 Page 的 JS 中定義數據,通過 {{}} 綁定:

// 頁面.js
Page({data: {durationMs: 90000, // 毫秒durationSec: 150   // 秒}
})
<!-- 頁面.wxml -->
<text>動態毫秒值:{{timeUtils.convertToMinutes(durationMs)}}分鐘</text>
<text>動態秒值:{{timeUtils.convertSecondsToMinutes(durationSec)}}分鐘</text>

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/bicheng/85880.shtml
繁體地址,請注明出處:http://hk.pswp.cn/bicheng/85880.shtml
英文地址,請注明出處:http://en.pswp.cn/bicheng/85880.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

ByteMD 插件系統詳解

ByteMD 插件系統詳解 ByteMD 的插件系統是其強大擴展性的核心。它允許開發者在 Markdown 解析、AST 轉換、HTML 渲染、以及編輯器 UI 交互的各個階段注入自定義邏輯。這得益于 ByteMD 深度集成了 unified 處理器和其豐富的生態系統&#xff08;remark 用于 Markdown&#xff0c…

每日一練之 Lua 表

Lua 的 table 是什么數據結構&#xff1f;如何創建和訪問&#xff1f; 數據結構:Lua的table是一種哈希表&#xff0c;使用鍵值對存儲數據&#xff0c;支持動態擴容 創建方式: local t1 {} local t2 {10,20,30} local t3 {name"Alice",age25}訪問方式&#xff1a…

實現自動胡批量抓取唯品會商品詳情數據的途徑分享(官方API、網頁爬蟲)

在電商領域&#xff0c;數據就是企業的核心資產。無論是市場分析、競品研究&#xff0c;還是精準營銷&#xff0c;都離不開對大量商品詳情數據的深入挖掘。唯品會作為知名的電商平臺&#xff0c;其豐富的商品信息對于眾多從業者而言極具價值。本文將詳細探討實現自動批量抓取唯…

Zephyr 高階實踐:徹底講透 west 構建系統、模塊管理與跨平臺 CI/CD 配置

本文是 Zephyr 項目管理體系的高階解構與實戰指南&#xff0c;全面覆蓋 west 構建系統原理、模塊解耦與 west.yml 多模塊維護機制&#xff0c;結合企業級多平臺 CI/CD 落地流程&#xff0c;深入講解如何構建可靠、可維護、跨芯片架構的一體化 Zephyr 工程。 一、為什么 Zephyr …

我開源了一套springboot3快速開發模板

我開源了一套springboot3快速開發模板 開箱即用、按需組合、可快速二次開發的后端通用模板。 ? 主要特性 Spring Boot 3.x Java 17&#xff1a;跟隨 Spring 最新生態&#xff0c;利用現代語法特性。多模塊分層&#xff1a;common 抽象通用能力、starter 負責啟動、modules…

OpenCV CUDA模塊設備層-----在GPU上計算兩個uchar1類型像素值的反正切(arctangent)比值函數atan2()

操作系統&#xff1a;ubuntu22.04 OpenCV版本&#xff1a;OpenCV4.9 IDE:Visual Studio Code 編程語言&#xff1a;C11 算法描述 對輸入的兩個 uchar1 像素值 a 和 b&#xff0c;先分別歸一化到 [0.0, 1.0] 浮點區間&#xff0c;然后計算它們的 四象限反正切函數。 函數原型…

從C++編程入手設計模式——觀察者模式

從C編程入手設計模式——觀察者模式 ? 觀察者模式簡直就是字如其名&#xff0c;觀察觀察&#xff0c;觀察到了告訴別人。觀察手的作用如此&#xff0c;觀察者模式的工作機制也是如此。這個模式的核心思路是&#xff1a;一個對象的狀態發生變化時&#xff0c;自動通知依賴它的…

MITM 中間人攻擊

?據Akamai 2023網絡安全報告顯示&#xff0c;MITM攻擊在數據泄露事件中占比達32.7%&#xff0c;平均每次事件造成企業損失$380,000? ?NIST研究指出&#xff1a;2022-2023年高級MITM攻擊增長41%&#xff0c;近70%針對金融和醫療行業? 一、MITM攻擊核心原理與技術演進 1. 中…

llama_index chromadb實現RAG的簡單應用

此demo是自己提的一個需求&#xff1a;用modelscope下載的本地大模型實現RAG應用。畢竟大模型本地化有利于微調&#xff0c;RAG使內容更有依據。 為什么要用RAG&#xff1f; 由于大模型存在一定的局限性&#xff1a;知識時效性不足、專業領域覆蓋有限以及生成結果易出現“幻覺…

TDMQ CKafka 版事務:分布式環境下的消息一致性保障

解鎖 CKafka 事務能力的神秘面紗 在當今數字化浪潮下&#xff0c;分布式系統已成為支撐海量數據處理和高并發業務的中流砥柱。但在這看似堅不可摧的架構背后&#xff0c;數據一致性問題卻如影隨形&#xff0c;時刻考驗著系統的穩定性與可靠性。 CKafka 作為分布式流處理平臺的…

常見的負載均衡算法

常見的負載均衡算法 在實現水平擴展過程中&#xff0c;負載均衡算法是決定請求如何在多個服務實例間分配的核心邏輯。一個合理的負載均衡策略能夠有效分散系統壓力&#xff0c;提升系統吞吐能力與穩定性。 負載均衡算法可部署在多種層級中&#xff0c;如七層HTTP反向代理&…

數據結構轉換與離散點生成

在 C 開發中&#xff0c;我們常常需要在不同的數據結構之間進行轉換&#xff0c;以滿足特定庫或框架的要求。本文將探討如何將 std::vector<gp_Pnt> 轉換為 QVector<QPointF>&#xff0c;并生成特定范圍內的二維離散點。 生成二維離散點 我們首先需要生成一系列…

零基礎學習Redis(12) -- Java連接redis服務器

在我們之前的內容中&#xff0c;我們會發現通過命令行操作redis是十分不科學的&#xff0c;所以redis官方提供了redis的應用層協議RESP&#xff0c;更具這個協議可以實現一個和redis服務器通信的客戶端程序&#xff0c;來簡化和完善redis的使用。現階段有很多封裝了RESP協議的庫…

clangd LSP 不能找到項目中的文件

clangd LSP 不能找到項目中的文件 clangd LSP 不能找到項目中的文件 clangd LSP 不能找到項目中的文件 Normally you need to create compile_commands.json。 如果你使用 cmake 作為構建工具&#xff0c;請執行下面的命令&#xff1a; cmake -DCMAKE_EXPORT_COMPILE_COMMAN…

【內存】Linux 內核優化實戰 - vm.overcommit_memory

目錄 vm.overcommit_memory 解釋一、概念與作用二、參數取值與含義三、相關參數與配置方式四、實際應用場景建議五、注意事項 vm.overcommit_memory 解釋 一、概念與作用 vm.overcommit_memory 是 Linux 內核中的一個參數&#xff0c;用于控制內存分配的“過度承諾”&#xf…

Python:.py文件轉換為雙擊可執行的Windows程序(版本2)

流程步驟&#xff1a; 這個流程圖展示了將 Python .py 文件轉換為 Windows 可執行程序的完整過程&#xff0c;主要包括以下步驟&#xff1a; 1、準備 Python文件&#xff0c;確保代碼可獨立運行 2、安裝打包工具&#xff08;如 PyInstaller&#xff09; 3、打開命令提示符并定位…

【請關注】mysql一些經常用到的高級SQL

經常去重復數據&#xff0c;數據需要轉等操作&#xff0c;匯總高級SQL MySQL操作 一、數據去重&#xff08;Data Deduplication&#xff09; 去重常用于清除重復記錄&#xff0c;保留唯一數據。 1. 使用DISTINCT關鍵字去重單列 -- 從用戶表中獲取唯一的郵箱地址 SELECT DISTIN…

RA4M2開發涂鴉模塊CBU(2)----配置按鍵開啟LED

RA4M2開發涂鴉模塊CBU.2--配置按鍵開啟LED 概述視頻教學樣品申請硬件準備參考程序按鍵口配置中斷回調函數主程序 概述 本實驗演示如何在 Renesas RA4M2 單片機上使用 GPIO 輸入&#xff08;按鍵&#xff09; 觸發 GPIO 輸出&#xff08;LED&#xff09;&#xff0c;并使用e2st…

Linux——Json

一 概念 json是一種輕量級&#xff0c;基于文本的&#xff0c;可讀的數據交換格式&#xff0c;能夠讓數據在不同系統&#xff08;比如前端—后端&#xff0c;服務器—客戶端&#xff09;間方便傳遞/存儲。在編程語言中都內置了處理json數據的方法 二 語法規則 1. 數據格式&a…

大模型之微調篇——指令微調數據集準備

寫在前面 高質量數據的準備是微調大模型的重中之重&#xff0c;一些高質量的數據集可能遠比模型性能更佳重要。 我是根據自己的數據照著B站up code花園LLaMA Factory 微調教程&#xff1a;如何構建高質量數據集&#xff1f;_嗶哩嗶哩_bilibili做的。 數據集格式 在LLaMA Fa…