У цьому розділі ми збираємося використовувати масив для пояснення природного циклу охоплення у рендері. Для цього ми описали приклад масиву циклу реакції у рендері. Коли ми хочемо створити будь-яку веб-програму, дуже важливо мати знання про роботу з масивом даних. У цьому прикладі ми побачимо використання loop in реагувати js . У нашому наведеному прикладі ми збираємося використовувати цикл for у react js. Щоб це зробити, ми повинні виконати деякі кроки.
У цьому розділі ми будемо використовувати додаток React. Коли нам потрібна карта, цикл foreach і цикл for у react, ми можемо переглянути наступний приклад, щоб навчитися використовувати масив циклів n react js. У масиві нам завжди потрібні цикли for і foreach. Коли ми хочемо зациклити наш масив у досягненні, для цього знадобиться карта. Отже, ми збираємося пояснити приклад карти в React Native. Новий масив створюється методом map(). У масиві викликів він надає результат виклику функції для кожного елемента. Цим можна спростити процес створення циклу. Коли ми використовуємо карту, нам не потрібно використовувати функцію forEach і цикл for. Карта, цикл forEach, цикл for має багато відмінностей. Замість того, щоб перезаписувати існуючі дані, функція карти використовує дані та створює новий масив. Завдяки всім функціям і простоті функції карти, документи React наполегливо заохочують нас використовувати функцію карти.
Ми надамо два приклади в додатку React, щоб пояснити цю просту концепцію. У першому прикладі ми збираємося описати реагувати цикл, який має одновимірний масив. У другому прикладі ми опишемо цикл, який має багатовимірний масив. Обидва приклади такі:
приклад 1:
rc/App.js
import React from 'react'; function App() { const myArray = ['Jack', 'Mary', 'John', 'Krish', 'Navin']; return ( <table class="table"> <tr> <th>ID</th> <th>Name</th> <th>Email</th> </tr> {students.map((student, index) => ( <tr> <td>{student.id}</td> <td>{student.name}</td> <td>{student.email}</td> </tr> ))} </table> ); } export default App; Після запуску цього прикладу ми отримаємо такий попередній перегляд:
