我想通過 App.js 中的按鈕獲取用戶的輸入，從站點 API 獲取一些信息（數據 id），然后使用獲取的信息（id）通過將 id 發送到來向用戶顯示所需的信息Population.js 但它無法正常工作。我認為 componentDidUpdate 可能需要一些參數，因為我必須發送的獲取請求需要用戶輸入才能工作。此外，我認為我的代碼甚至在用戶按下按鈕之前就正在獲取信息，因為控制臺沒有顯示正確的信息我需要的 id（它顯示 4-5 個值，但全部都不正確）。如果我對值進行硬編碼，它就可以正常工作?；旧?，我想通過按鈕獲取輸入，使用該輸入來獲取某些內容，然后使用獲取的內容來獲取其他內容，然后顯示獲取的信息。請幫助我。我是 React 的初學者。這是APP.jsimport React from 'react';import './App.css';import Population from './Population.js';class App extends React.Component {    constructor(props) {        super(props);        this.state = { name: "" ,info : {},formSubmit: false};        this.handleInput = this.handleInput.bind(this);        this.handleFormSubmit = this.handleFormSubmit.bind(this);    }             handleInput (event) {        console.log(event.target.value);      }          handleFormSubmit (event) {        event.preventDefault();        console.log("the value " + event.target.value);        this.setState({formSubmit: true,name : event.target.value});      }              componentDidMount(){//the value property needs to be fetched from user         fetch(`https://wft-geo-db.p.rapidapi.com/v1/geo/cities?namePrefix=${value}`, {            "method": "GET",            "headers": {                "x-rapidapi-key": "c4ab967692mshc65dd5c6e10a987p1790bejsn81ea7b831444",                "x-rapidapi-host": "wft-geo-db.p.rapidapi.com"            }        })        .then(response => response.json())        .then(data => {            const newInfo = data.data;            const newName = newInfo[0].wikiDataId;            const newState = Object.assign({},this.state,{                info : newInfo,                name : newName            });            this.setState(newState);            console.log("The sent code " + this.state.name);        })        .catch(err => {            console.error(err);        });      }