Dev4ster

import React from 'react';
import AsyncSelect from 'react-select/async';

export default function PageComponent() {
  const mapResponseToValuesAndLabels = (data) => ({
    value: data.id,
    label: data.name,
  });

  async function callApi(value) {

Dev4ster

import React, { useState } from 'react';
import AsyncSelect from 'react-select/async';

export default function PageComponent() {
  const INITIAL_DATA = {
    value: 0,
    label: 'Selecione o usuário',
  };

  const [selectData, setselectData] = useState(INITIAL_DATA);

Dev4ster

useEffect(() => {
    const listElement = refElement.current; // this is a ref that you need to pass to your html element that contains scroll
    if (listElement) {
      listElement.onscroll = () => {
        const bottom = listElement.scrollHeight - listElement.scrollTop === listElement.clientHeight;
        if (bottom) {
          onEndReached(); // it is a prop you can change per a inside component method
        }
      };