I have a react JSX component that makes an api call to the backend and fetches the data I require. This data is currently inside a react-select tag which allows me to display all the options inside a dropdown. I'm trying now to use this dropdown to render the selection using charts, specifically react-chartjs-2. I've been trying for quite a while but I honestly am at my wits end.

Here's what the api call with the select looks like:

export default class ------ extends component{

constructor(props, context) {
    super(props, context);
    this.state = {
      selectedOption: {},
      
      };
  }


  fetchData = (inputValue, callback) => {
    setTimeout(() => {
      fetch(
        "api" +
          inputValue,
        {
          method: "GET",
        }
      )
        .then((resp) => {
          return resp.json();
        })
        .then((data) => {
          const tempArray = [];
          if (data) {
            if (data.length) {
              data.forEach((element) => {
                tempArray.push({
                  label: `${element.campo}`,
                  value: element.valor,
                });
              });
            } else {
              tempArray.push({
                label: `${data.campo}`,
                value: data.valor,
              });
            }
          }
          callback(tempArray);
        })
        .catch((error) => {
          console.log(error, "error");
        });
    }, 1000);
  };

  onSearchChange = (selectedOption) => {
    if (selectedOption) {
      this.setState({
        selectedOption,
      });
    }
  };

Here's the actual select element and the chart inside the return section

    render(){


         return(


              <AsyncSelect
               id="valx"
               value={this.state.selectedOption}
               loadOptions={this.fetchData}
               placeholder="placehold"
               onChange={(e) => {
               this.onSearchChange(e);
               }}
               defaultOptions={true}
               />


         <div class="charts">
            <Bar 
             id="MyBarChart"
             data={{}}
             options={{}}
             />
                <Pie
                 id="MyPieChart"
                 data={{}}
                 options={{}}
                 />
           </div>

I have a really long way to go when it comes to React, I'm sure the solution will turn out to be rather simple. Any and all help is welcome, and thanks in advance.