Necesito replicar un componente "n" veces. Para ello utilicé el método lodash times . El problema es que necesito un índice como clave para los componentes generados y no parece que lo tenga.
Tengo el siguiente código:
export const MyComponent: React.FC<{times: number}> = ({ times }) => { return ( <> {_.times(times, () => ( //I need a key={index} in this div <div className="bg-white border-4 border-white md:rounded-md md:p-2 content-center my-4 shadow w-full"> </div> ))} </> ); };Esto devolverá el componente que está dentro n veces .
Traté de hacer un método que devolviera el componente y estableciera un índice con useState , pero entra en un bucle infinito. Pensé en poner un gran número aleatorio como clave, por lo que es extremadamente difícil obtener el mismo, pero no me gusta esa solución. Me gustaría usar este método porque es limpio.
Entonces, ¿qué crees que podría hacer para darle un al componente?
Se le pasa como un parámetro de función:
_.times(times, (index) => (blabla))