Tengo un estado de "datos" que almacena los valores tomados de mi base de datos.
const [data, setData] = useState([]);
"datos" contiene una serie de objetos que se extrajeron de mi base de datos.
// so data is essentially (if I console.log it): data = [ {student:"Jeff",country:"London"}, {student:"Benjamin",country:"France"}, {student:"Franklin",country:"USA"} ];
Estoy usando React Select para mostrar las etiquetas de estos datos (solo quiero datos de "estudiantes"), pero no estoy seguro de cómo asignar estos datos a valores y etiquetas para ponerlos como opciones en mi componente React Select. He intentado lo siguiente pero me da error.
import Select from "react-select"; function myTable() { const myOptions = data.map(info => { value: {info.student}, label: {info.student} }); return ( <tr> <td> <Select isMulti options={myOptions}></Select> </td> </tr> ) };
Quiero que mis opciones contengan valores y etiquetas de mi objeto de estado de datos.
No necesita agregar info.student
en un objeto.
import Select from "react-select"; function myTable() { const myOptions = data.map(info => ({ value: info.student, label: info.student })); return ( <tr> <td> <Select isMulti options={myOptions}></Select> </td> </tr> )
Tiene un error de sintaxis con su función Array.prototype.map
. Debería ser:
const myOptions = data.map(info => ({ value: info.student, label: info.student })); // or const myOptions = data.map(info => { return { value: info.student, label: info.student } });