アプレット~~キーレンダリングリスト

リスト内の項目の位置が動的に変化するか、新しい項目がリストに追加され、あなたがプロジェクトのリストは、（のような、独自のアイデンティティと地位を維持したい場合は  <input/> 、入力されたコンテンツ  <switch/> 選択状態）を、あなたが必要とする  wx:key 項目のリストを指定します一意の識別子。

wx:key 2つの形式で提供された値：

1、文字列は、代表のためにアレイ内のプロパティ項目のサイクルは、プロパティの値は、文字列または数値のリスト内で一意である必要があり、動的に変更することはできません。

2、予約済みキーワードこれは表すために次のような必須アイテム自体が固有の文字列または数字で表したループ項目自体、

データの変更は、再描画するときにフレームワークの主要コンポーネントとの補正は、彼らが再配列されていることを確認しますだろう、というよりもコンポーネントがその状態を保持していることを保証するために、リストのレンダリングの効率を改善するために、再作成するレンダーレイヤをトリガーします。

使用コードWX：​​キーの例（WXML）

< スイッチ WX：のため = " {{objectArray}} " WX：キー= " 一意" > {{item.id}} </ 切り替え > 
<ボタンbindtap = " スイッチ" >スイッチ</ボタン> 
<ボタンbindtap = " addToFront " > </ button>の正面に追加


< スイッチ WX：のため = " {{numberArray}} " WX：キー= " *この" > {{アイテム}} </ スイッチ > 
<ボタンbindtap = " addNumberToFront ">フロント</ボタン>に番号を追加

使用コードは、WX：キーの例（JavaScriptを）

ページ（{ 
  データ：{ 
    objectArray：[ 
      {ID：5、ユニーク：' unique_5 ' }、
      {ID：4、ユニーク：' unique_4 ' }、
      {ID：3、ユニーク：' unique_3 ' }、
      {ID：2、ユニーク：' unique_2 ' }、
      {ID：1、ユニーク：' unique_1 ' }、
      {ID：0、ユニーク：' unique_0 ' }、 
    ]、
    numberArray：[ 1、2、3、4 ] 
  }、
  スイッチ：機能（E）{
     CONST長= この.data.objectArray.length
     ため（I =せ0 ; iが長さを<; ++ i）が{
       CONST X =数学.floor（Math.random（）* 長さ）
       のconst Y = Math.floor（Math.random（）* 長さ）
       CONST TEMP = この.data.objectArray [X]
       この .data.objectArray [X] = この.DATA。 objectArray [Y]
       この.data.objectArray [Y] = TEMP 
    } 
    この.setData（{ 
      objectArray：この.data.objectArray 
    }）
  }、
  addToFront：関数（E）{ 
    CONST長= この.data.objectArray.length
     この .data.objectArray = [ {ID：長さ、ユニーク：' unique_ ' +長さ}。]連結（この.data.objectArray）
     この.setData（{ 
      objectArray：この.data.objectArray 
    }）
  }、
  addNumberToFront：関数（E）{ 
    この .DATA。 numberArray = [ この.data.numberArray.length + 1 ] .concat（この.data.numberArray）
     この.setData（{ 
      numberArray：この.data.numberArray 
    }）
  } 
}）

 

 

 

 

 

 

。