reactjs - 将函数（道具）传递回父级 React Context Api

Question

您好，我无法将点击时的 id 传递回上下文文件以在页面上呈现正确的信息。我已经尝试了几乎所有的东西，但不确定该怎么做才能完成这项工作？！

上下文文件：这是headers.id = res.data[1].playerId我知道我需要一个函数来传递玩家 ID 但不确定如何从我的handleClick.

        
        // use mlbData in table
        setMlbData(res.data)
        
        // const pid = res.data.find(player => player.playerId == playerId)
        console.log(res.data)
        
        headers.id = res.data[1].playerId
        mlbapi = `/mlb/player/${headers.id}`
        // headers.id = res.data[1].playerId
        console.log(res.data)
        console.log(headers)
        res = await axios.get(url + mlbapi, {headers})
        
        setPlayerStats(res.data)

        
    }

PlayerList.js 文件：

const handleClick = (e) => {
        // console.log("I have been clicked", e.target.id)
        // console.log(`${playerId}`)
        history.push(`/stats/${e.target.id}`)
        console.log(e.target.id)
    }
    
    // const { fullName, teamImage, mlbData, playerId } = this.context
    const Team = ({ tableManager, value, field, data, column, colIndex, rowIndex }) => {
    return (
        <div onClick={ handleClick } className='rgt-cell-inner' style={{display: 'flex', alignItems: 'center', overflow: 'hidden'}}>
            <img src={data.teamImage} alt="user avatar" id={ playerId }/>
                <span className='rgt-text-truncate' style={{marginLeft: 10}}>{value}</span>
        </div>
        )
    }

App.js 文件：

function App() {

  return (

      <div className="App">
        <GetMlbData>
        <Navbar />
        <div className="content">
          <Switch>
            <Route exact path="/">
              <PlayerList />
            </Route> 
            <Route path="/stats/:id">
              <Stats />
            </Route> 
          </Switch>
        </div>
        </GetMlbData>
      </div>
  );
}

标签： reactjsreact-context