この記事では、WeChat ミニ プログラムが wxs タイプ ファイルを使用してデータ フィルタリングを実装する方法を紹介します。WeChat ミニ プログラム開発を学習している友人に役立つことを願っています。
WeChat アプレット開発データのフィルタリングの実装方法
WeChat アプレットの wxml と js の内部実装機構がコンパイルされているため、とは別に。したがって、wxml で js 関数を呼び出す方法はありません。これにより、WXML には一般的に使用される機能が欠けてしまいます。つまり、ビュー レイヤでデータをフォーマットする方法がありません。
推奨学習: 小規模プログラム開発
たとえば、タイムスタンプ データを含む配列をバックエンドから取得し、インターフェイスでこれらの日付をフォーマットする必要があります。日付形式は 2017-01-01 と表示されます。Vue や Angular などのフロントエンド Web フレームワークでは、ビュー レイヤーは通常、フィルターなどの比較的使いやすいソリューションを提供します。 Vue にはこれらのメソッドがありません。
しかし、ミニプログラムによって起動される wxs タイプのファイルは、この種の問題を解決するためのものです。
使用
まず、新しい filter.wxs ファイルを作成します (wxml ファイルに直接記述することもできますが、パブリック メソッドでは別のファイルを作成する必要があります)。 。
varformatDate =function(timestamp,option){ vardate= getDate(parseInt(timestamp)); varyear =date.getFullYear() varmonth =date.getMonth() +1 varday =date.getDate() varhour =function(){ if(date.getHours()<10){ //补‘0’return'0'+date.getHours() }r eturndate.getHours(); } varminute =function(){ if(date.getMinutes() <10) { return'0'+date.getMinutes() } returndate.getMinutes(); } varsecond =function(){ if(date.getSeconds() <10) { return'0'+date.getSeconds() } returndate.getSeconds(); } if(option=='notime'){ //不需要时间returnyear +'-'+ month +'-'+ day; } returnyear +'-'+ month +'-'+ day +' '+ hour() +':'+ minute() +:+ second(); } module.exports = { formatDate: formatDate, };
wxml ファイルで
Date を使用します: {{filter.formatDate(フィルター対象のタイムスタンプ)}}
注意事項
#wxs は js ファイルとは異なります。したがって、多くの js API はサポートされていません。特定のサポートについては、公式ドキュメントを参照してください。 たとえば、日付を取得するには、最初は new Date() を呼び出しました。これは wxs ではサポートされていませんが、アプレットは代わりにグローバル関数 getDate() を提供します。 PHP 中国語 Web サイト、多数のnavicat チュートリアル 学習へようこそ!
以上がWeChat アプレット開発データをフィルタリングする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。