Tengo una matriz de ubicaciones que consisten en datos en forma de matriz:
const locations = ['Mumbai', 'tuljapur', 'Bhagalpur', 'North East', 'Bongaigaon', 'South District', 'Pune', 'Cuttack', 'amritsar', 'East Godavari', 'Chandigarh']Cuando estoy pasando esta matriz para reaccionar, seleccione como accesorio de opciones. Está dando el siguiente error:
ScrollManager.tsx:48 Uncaught TypeError: Cannot use 'in' operator to search for 'options' in Mumbai at ScrollManager.tsx:48:1 at Array.map (<anonymous>) at buildCategorizedOptions (ScrollManager.tsx:48:1) at Select._this.buildCategorizedOptions (ScrollManager.tsx:48:1) at Select._this.buildFocusableOptions (ScrollManager.tsx:48:1) at Select.openMenu (ScrollManager.tsx:48:1) at Select._this.onInputFocus (ScrollManager.tsx:48:1) at HTMLUnknownElement.callCallback (react-dom.development.js:4161:1) at Object.invokeGuardedCallbackDev (react-dom.development.js:4210:1) at invokeGuardedCallback (react-dom.development.js:4274:1)Aquí está el componente React Select:
<Select className="ml-4 mb-4 w-[180px]" placeholder="School Name" // isClearable={true} options={locations} name={"class"} // value={selectedFilters.status} />¿Cómo puedo enviar mi matriz como opciones en react-select?
React Select espera que las opciones se pasen como una matriz de objetos en este formato:
{ value: 'value here', label: 'Label here' }
Por lo tanto, debe pasar ubicaciones como una matriz de objetos a options de React-Select select como:
[ { label: "Mumbai", value: "Mumbai" }, { label: "tuljapur", value: "tuljapur" }, .... ]Referencia: https://react-select.com/home#getting-started
Enlace de Code Sandbox https://codesandbox.io/s/pb4r2s?module=/example.tsx