Tengo campos de texto dinámicos que se repiten cada vez que hago clic en un botón. A partir de ahora, colorList es una matriz, y así es como se muestra en la console . Planeo guardar esto en firestore.

consola

base de fuego

Quería almacenar esto en Firebase como map para que sea algo así como red: 10 ya que estaría actualizando estas existencias en red

Códigos

 const [colorList, setColorList] = useState([{ color: "", colorStocks: "" }]); {colorList.map((singleColor, index) => ( <div key={index}> <div style={{ display: "flex" }}> <Grid item> <TextField label="color" name="color" type="text" id="color" required value={singleColor.color} onChange={(e) => handleColorChange(e, index)} /> </Grid> <br /> <Grid item > <TextField label="Stocks" name="colorStocks" type="number" id="colorStocks" required value={singleColor.colorStocks} onChange={(e) => handleColorChange(e, index)} /> </Grid> </div> <br /> //buttons here to add and remove textfields </div> ))}