0

Buen día tengo un 2 funciones que me devuelven 2 estados diferentes los cuales quiero mapear en una tabla. mi problema es que no se como hacer un mapeo dentro de otro.

Actualmente tengo asi mi codigo en la tabla:

<tbody>
      {
         this.state.datas.map((item, _index) => {
          //let mostrar_input = (item.first_name != '') ? true : false;
               return (
                 <tr key={item.iddef_type_room_relations} id={"tr" + item.hotel_description}>
                                        {/* Resort */}
                                        <td><a to="chart" target="_blank" href="https://www.palaceproagents.com" className="text-main text-capitalize">{item.hotel_description}</a></td>
                                        {/* Check-in */}
                                        <td><DateFormat date={item.arrival_date}/></td>
                                        {/* Check-out */}
                                        <td><DateFormat date={item.departure_date}/></td>
                                        {/* Duration */}
                                        <td>{item.nigths} nights</td>
                                        {
                                            this.state.count.map((item, index) => {
                                                return(
                                                    {/* Total Rooms On */}
                                            <td>
                                                <th>{item.estado1}</th>
                                                <th>{item.estado2}</th>
                                                <th>{item.estado3}</th>
                                            </td>
                                            )
                                            })
                                        }
                                        {/* Room type */}
                                        <td><a to="chart" className="text-main text-capitalize" href="javascript:void(0)" data-toggle="modal" data-target="#exampleModal">{item.room_type_description}</a></td>
                                    </tr>
                                    )
                                })
                            }
                        </tbody>

Lo cual no funciona. Agradeceria mucho me ayudaran y quedo atento a sus comentarios.

3
  • Hola Luis, de pronto podriamos ofrecerte una mejor respuesta si sabemos que hay dentro de tu state de esa forma podemos saber qué objetos son arreglos para aplicar el ´map´ o la iteración y cuales no Commented el 9 ago. 2019 a las 23:20
  • Pues de hecho cada state es una arreglo en si por ejemplo el estado datas:{iddef_type_room_relations: 4, arrival_date: 4, departure_date: 4, nigths: 4, etc.} y count:{estado1: 2, estado2: 2, estado3: 2}. Commented el 10 ago. 2019 a las 14:56
  • {/* Total Rooms On */} no debería ir. Eso es error de sintaxis, ya que no se pueden retornar etiquetas adyacentes. Commented el 11 ago. 2019 a las 21:39

1 respuesta 1

1

Para generar un .MAP dentro de otro lo puedes hacer de esta manera, te pongo como ejemplo para sacar todas las subcategorias de todas las categorias de una web.

Ejemplo de un objeto de categorías de subcategorias.

this.state = {
  categories: [
    {
      name: "Consolas",
      subcategories: [
        {
          name: "PS4"
        },
        {
          name: "Xbox"
        }
      ]
    },
    {
        name: "Videojuegos",
        subcategories: [
          {
            name: "PS4"
          },
          {
            name: "Xbox"
          }
        ]
      }
  ]
};

Bucle con .MAP

{categories.map((category, categoryIndex) => {
    const subcategories = category;

    {subcategories.map((subcategory, subcataegoryIndex) => (
        <span key={subcataegoryIndex}>
            {subcategory.name}
        </span>
      ))}
    );
})}

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.