WhatsApp chat

React como trabajar con map

Marlon Falcon Hernandez, react
Back

Map es una función que nos permite iterar sobre un arreglo y devolver un nuevo arreglo con los elementos modificados. Para usar map se debe usar la siguiente sintaxis:

const numbers = [1, 2, 3, 4, 5];
const doubled = numbers.map((number) => number * 2);
console.log(doubled);


  const initialState = [
    { id: 1, name: "maria" , lastname: "Falcon"},
    { id: 2, name: "Yoel" , lastname: "Herrera"},
    { id: 3, name: "Raul" , lastname: "Lopez"},
  ]

  const[data, setData] =  useState(initialState)


<Table>
            <thead>
              <tr>
                <th>id</th>
                <th>name</th>
                <th>lastname</th>
                <th>Actions</th>
              </tr>
            </thead>
            <tbody>
                {data.map((item)=>(
                      <tr key={item.id}>
                         <td>{item.id}</td>
                         <td>{item.name}</td>
                         <td>{item.lastname}</td>
                         <td></td>
                      </tr>  
                ))}
            </tbody>
</Table>


mfalconsoft@gmail.com / +34 (662) 47 0645RSS