アプレット--API

2513 ワード

  • ページのドロップダウン・リフレッシュの2つの方法
  • json構成
  • ドロップダウンリフレッシュが必要なページ構成xxx.json
  •    {
            //         
            "enablePullDownRefresh": true,
            //      、loading     ,    dark/light,  light    
            "backgroundTextStyle": "dark",
            //                  ,   px
            "onReachBottomDistance": 50
        }
    
  • jsファイルはリスニングイベントを定義し、完了後にドロップダウン・リフレッシュを閉じてPageでonPullDownRefresh処理関数を定義し、このページのユーザーのドロップダウン・リフレッシュ・イベント
  • をリスニングする.
          onPullDownRefresh() {
                // doing some thing
                //                    
                setTimeout(function() {
                      wx.stopPullDownRefresh()
                }, 1000)
          }
    
  • はwxを用いる.startPullDownRefresh(Object object) 、wx.stopPullDownRefresh(Object object)
  • wx.startPullDownRefresh()はドロップダウン・リフレッシュを開始し、呼び出し後にドロップダウン・リフレッシュ・アニメーションを開始し、効果はユーザーの手動ドロップダウン・リフレッシュと一致する
  • wx.stopPullDownRefresh()現在のページのドロップダウン・リフレッシュを停止します.
  • パラメータ
  • successインタフェース呼び出しに成功したコールバック
  • failインタフェース呼び出しに失敗したコールバック
  • completeインタフェース終了時のコールバック関数
  •     wx.startPullDownRefresh({
              success: () => {}
              fail: () => {}
              complete: () => {}
        })
    

    ⚠️ドロップダウンリフレッシュでwxを使用する.showToastなどのインタラクティブなフィードバックは、リバウンド距離が大きすぎることを招きます
  • データバインドWXMLの動的データは、対応するPageのdataから取得される
  • データバインディングは、Mustache構文( )を使用して変数をパッケージ化する.1.コンポーネント属性2.コントロール属性3.キーワード
  • の演算は{}}内で簡単な演算を行うことができ、サポートする方式1.三元演算Hidden 2.演算{a+b}+{c}+d 3.論理判断4.文字列演算{"hello"+name}}5.データパス演算{object.key}{{array[0]}}
  • リストレンダリングwx:for
  • デフォルト配列の現在の項目の下付き変数名はindexデフォルト、配列現在の項目の変数名はitem
  • デフォルト
  • wx:for-itemを使用して配列の現在の要素を指定できる変数名wx:for-indexを使用して配列の現在の下付き変数を指定できる
  • wx:forは
  • をネストできます
  • block wx:forはblock wx:ifに似ています.また、wx:forをラベルに使用して、マルチノードを含む構造ブロック
  • をレンダリングすることもできます.
  • wx:keyの値は2つの形式で提供されます.
  • 文字列は、forループのarray内のpropertyを表し、リスト内の一意の文字列または数値が必要であり、動的に変更できない.
  • キーワードを保持*thisはforループ内のitem自体を表し、item自体が一意の文字列または数字
  • である必要があることを示す.
    , key , , , , 。 wx:key, warning, , ,
  • 条件レンダリングwx:if
  • wx:if="{{condition}}"は、コードブロック
  • をレンダリングする必要があるか否かを判断する.
  • wx:elifおよびwx:elseは、elseブロックを追加するために使用されます.⚠️ コンポーネントではなく、パッケージ要素であり、ページ内ではレンダリングされず、制御属性
  • のみが受け入れられます.