WXS
WXS(WeiXin Script)是小程序的一套脚本语言,结合 WXML,可以构建出页面的结构。
注意事项
WXS 不依赖于运行时的基础库版本,可以在所有版本的小程序中运行。 WXS 与 JavaScript 是不同的语言,有自己的语法,并不和 JavaScript 一致。 WXS 的运行环境和其他 JavaScript 代码是隔离的,WXS 中不能调用其他 JavaScript 文件中定义的函数,也不能调用小程序提供的API。 WXS 函数不能作为组件的事件回调。 由于运行环境的差异,在 iOS 设备上小程序内的 WXS 会比 JavaScript 代码快 2 ~ 20 倍。在 android 设备上二者运行效率无差异。
日期格式化
- date.wxs
var formatTime = function (date) { var date = getDate(date) var year = date.getFullYear() var month = date.getMonth() + 1 var day = date.getDate() var hour = date.getHours() var minute = date.getMinutes() var second = date.getSeconds() //拼接日期 return [year, month, day].map(formatNumber).join('-') + ' ' + [hour, minute, second].map(formatNumber).join(':') } //判断长度,如果是长度为2,输出n,否则前面补上一个 0 var formatNumber = function(n) { n = n.toString() return n[1] ? n : '0' + n } module.exports = { formatTime: formatTime, //引用格式时间 formatNumber: formatNumber //引用格式时间数字,例:2021年1月1日不会输出为 2021-1-1,而是 2021-01-01 }
动态逻辑
- js
/** * 页面的初始数据 */ data: { time: new Date().toString(), //获取当前世界时间-初始时间转化字符串 }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { //间隔1秒刷新时间:重新获取一次当前时间,赋值 setInterval(() => { var date = new Date().toString(); this.setData({ time: date, }) }, 1000) },
页面显示
- wxml
<!--导入文件 格式化日期--> <wxs module="tutil" src="../index/date.wxs"></wxs> <!--时间显示--> <text>{{tutil.formatTime(time)}}</text>
效果演示