您好,登錄后才能下訂單哦!
這篇文章給大家分享的是有關(guān)微信小程序中如何實(shí)現(xiàn)數(shù)據(jù)過濾的內(nèi)容。小編覺得挺實(shí)用的,因此分享給大家做個(gè)參考,一起跟隨小編過來看看吧。
因?yàn)槲⑿判〕绦虻膚xml和js的內(nèi)部實(shí)現(xiàn)機(jī)制是分開編譯的。所以在wxml是沒辦法調(diào)用js的函數(shù)的。這會(huì)導(dǎo)致WXML缺少一個(gè)我們常用的功能,那就是沒有辦法在視圖層對(duì)數(shù)據(jù)進(jìn)行格式化處理。比如我們從后端獲取到一個(gè)包含了時(shí)間戳數(shù)據(jù)的數(shù)組,然后需要在界面上把這些日期都格式化顯示為2017-01-01這種格式的日期形式,在Vue, Angular之類的前端Web框架中,一般在視圖層都提供了如filter之類相應(yīng)比較好用的方案。vue是沒有這些方法的。但是小程序推出了wxs類型文件就是解決這類問題的。
使用
首先新建filter.wxs文件(也可以直接寫在wxml文件中,但是這中公共方法還是應(yīng)該單獨(dú)建文件的)。
var formatDate = function (timestamp,option) { var date = getDate(parseInt(timestamp)); var year = date.getFullYear() var month = date.getMonth() + 1 var day = date.getDate() var hour = function(){ if (date.getHours()<10){ //補(bǔ)‘0’ return '0' + date.getHours() } return date.getHours(); } var minute = function () { if (date.getMinutes() < 10) { return '0' + date.getMinutes() } return date.getMinutes(); } var second = function () { if (date.getSeconds() < 10) { return '0' + date.getSeconds() } return date.getSeconds(); } if (option=='notime'){ //不需要時(shí)間 return year + '-' + month + '-' + day; } return year + '-' + month + '-' + day + ' ' + hour() + ':' + minute() + ":" + second(); } module.exports = { formatDate: formatDate, };
在wxml文件中使用
<wxs src='filter.wxs' module='filter' /> <view>日期:{{filter.formatDate(要過濾的時(shí)間戳)}}</view>
注意事項(xiàng)
wxs是不同于js文件的。所以很多js的api是不支持的。具體支持看官方文檔。
感謝各位的閱讀!關(guān)于“微信小程序中如何實(shí)現(xiàn)數(shù)據(jù)過濾”這篇文章就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,讓大家可以學(xué)到更多知識(shí),如果覺得文章不錯(cuò),可以把它分享出去讓更多的人看到吧!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請(qǐng)聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。