Estoy creando una selección (en este momento estoy usando el componente React-Select) para recuperar todo el resultado de la API.
El problema es que la API me devuelve 20 valores, por lo que debería encontrar un método para cargar otros 20 valores (mientras hago otra llamada a la API)
const option = personList && personList .map((spl) => { return { value: spl.perCod, label: spl.perName } }) <Row> <Col> <Select id="perCod" name="perCod" options={option} /> </Col> </Row>la lista de personas se rellena llamando a la API:
useEffect(() => { sortEntities(); }, [paginationState.activePage, paginationState.order, paginationState.sort]); const sortEntities = = () => { //... props.getFilteredEntities( search, // i pass there the parameters for the research paginationState.activePage - 1, paginationState.itemsPerPage, `${paginationState.sort},${paginationState.order}` ), }props.getFilteredEntities en mi reductor es:
export const getFilteredEntities: ICrudSearchAction<Person> = (search, page, size, sort) => { const params = new URLSearchParams(search) ? new URLSearchParams(search).toString() : null; const requestUrl = `${apiUrl}${sort ? `?page=${page}&size=${size}&sort=${sort}` : ''}${sort ? '&' : '?'}${params}`; return { type: ACTION_TYPES.FETCH_PERSON_LIST, payload: axios.get<Person>(`${requestUrl}${sort ? '&' : '?'}cacheBuster=${new Date().getTime()}`), }; };Por el momento, mi selección tiene los primeros 20 resultados de api. Debería necesitar cargar otros. ¿Como lo puedo hacer? gracias.
cambie su código <Select> con esto, debe agregar la etiqueta de option dentro de la iteración, para representar todas las opciones dentro de la etiqueta de selección,
<Select id="perCod" name="perCod"> {option.map(o=><option key={Math.random()} value={o.perCod} >{o.perName}</option>)} </Select>