logo

React JS のループ配列 | React の Foreach ループの例

このセクションでは、配列を使用して、レンダリングでのリーチ ネイティブ ループについて説明します。このために、レンダリングでの反応ループ配列の例を説明しました。 Web アプリケーションを構築する場合、一連のデータの処理に関する知識を持っていることが非常に重要です。この例では、ループの使用を見ていきます。 jsに反応する 。この例では、react js で for ループを使用します。これを実行するには、いくつかの手順に従う必要があります。

このセクションでは、React アプリを使用します。 React でマップ、foreach ループ、for ループが必要な場合、次の例を見てループ配列 n の使用方法を学ぶことができます。配列では、常に for ループと foreach ループが必要になります。配列をリーチ内でループさせたい場合、これを行うにはマップが必要になります。そこでReact Nativeでのマップの例を説明していきます。新しい配列は、map() メソッドによって作成されます。呼び出し配列では、各要素の関数を呼び出した結果が提供されます。これにより、ループ処理を簡略化することができる。マップを使用する場合、forEach 関数と for ループを使用する必要はありません。 Map、forEach ループ、for ループには多くの違いがあります。既存のデータを上書きする代わりに、map 関数はデータを使用して新しい配列を作成します。マップ関数のすべての機能とシンプルさのため、React ドキュメントではマップ関数を使用することを強く推奨しています。

この簡単な概念を説明するために、反応アプリの 2 つの例を示します。最初の例では、一次元配列を持つ反応ループについて説明します。 2 番目の例では、多次元配列を持つループについて説明します。両方の例は次のとおりです。

例 1:

rc/App.js

 import React from &apos;react&apos;; function App() { const myArray = [&apos;Jack&apos;, &apos;Mary&apos;, &apos;John&apos;, &apos;Krish&apos;, &apos;Navin&apos;]; return ( <table class="table"> <tr> <th>ID</th> <th>Name</th> <th>Email</th> </tr> {students.map((student, index) =&gt; ( <tr> <td>{student.id}</td> <td>{student.name}</td> <td>{student.email}</td> </tr> ))} </table> ); } export default App; 

この例を実行すると、次のプレビューが表示されます。

React JS のループ配列