この記事では、WeChat アプレットでのデータ フィルタリングの実装方法 (コード) を紹介します。必要な方は参考にしてください。
WeChat アプレットの wxml と js の内部実装メカニズムは別々にコンパイルされるためです。したがって、wxml で js 関数を呼び出す方法はありません。これにより、WXML には一般的に使用される機能が欠けてしまいます。つまり、ビュー レイヤでデータをフォーマットする方法がありません。たとえば、バックエンドからタイムスタンプ データを含む配列を取得し、Vue ではこれらの日付を 2017-01-01 の日付形式でインターフェイスに表示する必要があります。 Angular などのフロントエンド Web フレームワークは、通常、ビュー レイヤーのフィルターなど、比較的使いやすいソリューションを提供します。 Vue にはこれらのメソッドがありません。しかし、ミニプログラムで起動するwxsタイプのファイルは、このような問題を解決するものです。
使用
まず、新しい filter.wxs ファイルを作成します (wxml ファイルに直接記述することもできますが、パブリック メソッドでは別のファイルを作成する必要があります)。 。
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){ //补‘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'){ //不需要时间 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(要过滤的时间戳)}}</view>
注意事項
wxs は js ファイルとは異なります。したがって、多くの js API はサポートされていません。特定のサポートについては、公式ドキュメントを参照してください。
以上がWeChatアプレットでのデータフィルタリングの実装方法の紹介(コード)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。