类型错误： "onChange is not a function"

Question

我试图从子组件更改父组件的状态值，但收到onChange is not a function错误。我已经尝试了我找到的所有解决方案，但都无济于事。

这是父组件的代码：

const [playerCount, setPlayerCount] = useState(0);
const handleChange = (newValue) => {
setPlayerCount(newValue);
}
return (
<div className="App">
<Question question={question}/>
{renderBoard()}
<div className="players">
{players}
</div>
<div>
{!isBetted && allPlayersAnswered? <Bid color={playerColors[playerCount]} playerCount={playerCount} onChange={handleChange}></Bid> : ''}
</div>
</div>
);

这是Bid.js-子组件：

import React from 'react'
const Bid = (color,playerCount, onChange) => {
const handleChange = () => {
onChange(playerCount+1);
}

return (
<button onClick={handleChange}>Click Me</button>
)
}
export default Bid

谢谢你的帮助！

Answer 1

组件的props是一个对象，因此您需要按如下方式传递它：

Bid = ({ color, playerCount, onChange })