Блог

Мне нужно вызвать API метода Get. При этом выберите раскрывающееся значение. Если я выберу раскрывающиеся параметры=»A»=1, это значение будет установлено в URL API «http://localhost:12345/api/GetProfile/Get_MyPostDetails?id=${Входное значение}». Пожалуйста, поделитесь любой идеей в react js. Раскрывающиеся значения устанавливаются вручную.

На этот раз я попробовал

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

function App() {
  const [inputValue, setValue] = useState('');
  const [selectedValue, setSelectedValue] = useState(null);

  // handle input change event
  const handleInputChange = value => {
    setValue(value);
  };

  // handle selection
  const handleChange = value => {
    setSelectedValue(value);
  }

  const category=() =>
  [

    {
        value:1,
        label:"2017"

    },
    {
        value:2,
        label:"2018"
    },
    {
         value:3,
         label:"2019"
    },
    {
        value:4,
        label:"2020"
    },
    {
        value:5,
        label:"2021"
    },
    {
        value:6,
        label:"2022"
    }



];


  // load options using API call
  const loadOptions = (inputValue) => {
    let user = JSON.parse(localStorage.getItem('user'));
   
    const accessToken=user;
    fetch(`http://localhost:12345/api/GetProfile/Get_MyPostDetails?id=${inputValue}`, {
    method: 'get',
    headers:{

      Accept: 'application/json',             
        Authorization: "Bearer "  accessToken 
         
    },
  
  }).then(res => res.json());
  };

  return (
    <div className="App">
      <h3>React-Select Async Dropdown - <a href="https://www.cluemediator.com/" target="_blank" rel="noopener noreferrer">Clue Mediator</a></h3>
      <pre>Input Value: "{inputValue}"</pre>
      <AsyncSelect
        cacheOptions
        defaultOptions
        value={selectedValue}
        options={category}
        loadOptions={loadOptions}
        onInputChange={handleInputChange}
        onChange={handleChange}
      />
      <pre>Selected Value: {JSON.stringify(selectedValue || [{}], null, 2)}</pre>
    </div>
  );
}

export default App;
 

Я пробовал это, но это не сработало, потому что мне нужно получить массив объектов 9multiple записей) он отображает отдельные записи, а также отображает значение параметра из URL API, который я хочу добавить вручную

Заранее спасибо