⼩程序,数据过滤(filter)的实现
因为⼩程序的wxml和js的内部实现机制是分开编译的。所以在wxml是没办法调⽤js的函数的。这会导致WXML缺少⼀个我们常⽤的功能,那就是没有办法在视图层对数据进⾏格式化处理。⽐如我们从后端获取到⼀个包含了时间戳数据的数组,然后需要在界⾯上把这些⽇期都格式化显⽰为2017-01-01这种格式的⽇期形式,在Vue, Angular之类的前端Web框架中,⼀般在视图层都提供了如filter之类相应⽐较好⽤的⽅案。vue是没有这些⽅法的。但是⼩程序推出了wxs类型⽂件就是解决这类问题的。
使⽤
⾸先新建filter.wxs⽂件(也可以直接写在wxml⽂件中,但是这中公共⽅法还是应该单独建⽂件的)。
var formatDate = function (timestamp,option) {
var date = getDate(parseInt(timestamp));
var year = FullYear()
var month = Month() + 1
var day = Date()
var hour = function(){
if (Hours()<10){ //补‘0’
return '0' + Hours()
}
Hours();
filter过滤对象数组}
var minute = function () {
if (Minutes() < 10) {
return '0' + Minutes()
}
Minutes();
}
var second = function () {
if (Seconds() < 10) {
return '0' + Seconds()
}
Seconds();
}
if (option=='notime'){ //不需要时间
return year + '-' + month + '-' + day;
}
return year + '-' + month + '-' + day + ' ' + hour() + ':' + minute() + ":" + second();
}
formatDate: formatDate,
};
在wxml⽂件中使⽤
<wxs src='filter.wxs' module='filter' />
<view>⽇期:{{filter.formatDate(要过滤的时间戳)}}</view>
注意事项
wxs是不同于js⽂件的。所以很多js的api是不⽀持的。具体⽀持看。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论