WeChatアプレットでのデータフィルタリングの実装方法の紹介（コード）

この記事では、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 &#39;0&#39; + date.getHours()
    }
    return date.getHours();
  }
  var minute = function () {
    if (date.getMinutes() < 10) {
      return &#39;0&#39; + date.getMinutes()
    }
    return date.getMinutes();
  }
  var second = function () {
    if (date.getSeconds() < 10) {
      return &#39;0&#39; + date.getSeconds()
    }
    return date.getSeconds();
  }

  if (option==&#39;notime&#39;){  //不需要时间
    return year + &#39;-&#39; + month + &#39;-&#39; + day;
  }

  return year + &#39;-&#39; + month + &#39;-&#39; + day + &#39; &#39; + hour() + &#39;:&#39; + minute() + ":" + second();
}

module.exports = {
  formatDate: formatDate,
};

wxml ファイルでの

<wxs src=&#39;filter.wxs&#39; module=&#39;filter&#39; />
  <view>日期：{{filter.formatDate(要过滤的时间戳)}}</view>

の使用

注意事項

wxs は js ファイルとは異なります。したがって、多くの js API はサポートされていません。特定のサポートについては、公式ドキュメントを参照してください。

以上がWeChatアプレットでのデータフィルタリングの実装方法の紹介（コード）の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。