No puedo manejar la selección múltiple, debido al hecho de que uso Estado y cada vez que selecciono una opción, se agrega un nuevo elemento, pero necesito almacenar todos los resultados en una matriz.
Por favor encuentre debajo de mi código:
const [categories, setCategories] = useState([]); return ( <div className="create"> <h2>Add a New Rating</h2> <form onSubmit={handleSubmit}> <label>Review title:</label> <label>Rating:</label> <select style={{ height: "170px" }} className="multiple" multiple={true} value={categories} onChange={(e) => setCategories(e.target.value)} #<-- here, I don't know how to store more items in the initial array > {data.categories.data.map((category) => ( <option value={category.id} key={category.id}> {category.attributes.name} </option> ))} </select> <button>Add Review</button> </form> </div> ); };¿Cómo puedo implementar la selección múltiple en esta aplicación de reacción?
También puede usar el método .concat. Devuelve una nueva matriz como estado no manipulado.
setCategories(categories.concat(e.target.name));
Lo resolvi con este:
const updateFieldChanged = e => { console.log('property name: '+ e.target.name); let newArr = [...categories]; // copying the old datas array newArr.push(e.target.value); // replace e.target.value with whatever you want to change it to setCategories(newArr); }