ResultsTableボタンをクリックしますhandleClick関数に希望の値を受け取りますが、setStateはgameIdを設定せずに残っていますが、どこが間違っていますか?私がログゲームをコンソールにしたら、それは私が持っているものです。何か助けてくれてありがとう。React setState関数は値を変更しません
class ResultsTableContainer extends Component {
constructor(props) {
super(props);
this.state = {
tableConfig,
games: [],
gameId: ""
};
}
handleClick = event => {
event.preventDefault();
const gameId = event.target.id;
this.setState({ gameId });
console.log(this.state);
};
currentContent =() => {
if (this.state.gameId !== "") {
return <GameDetailsContainer gameId={this.state.gameId} />;
}
return (
<ResultsTable
tableConfig={this.state.tableConfig}
games={this.state.games}
onButtonClick={this.handleClick}
/>
);
};
render() {
return <div>{this.currentContent()}</div>;
}
}
export default ResultsTableContainer;
ResultsTable.jsx
const ResultsTable = ({ games, tableConfig, onButtonClick }) => (
<Table>
...
<TableBody>
{games.map((game, index) => (
...
<button>
<Link
to={`/games/${game.id}`}
onClick={onButtonClick}
id={game.id}
>
Results
</Link>
</button>
</TableBody>
</Table>
);
export default ResultsTable;
後にコンソールを呼び出さないでください。これが最も一般的な反応です。 – jmargolisvt
@jmargolisvt:OPがそれをやっているようです。彼らは*クラスフィールド*プロポーザルに矢印機能を使用しています。 –
状態はすぐに更新されないので、 'this.setState({gameId}); console.log(this.state); 'は古い状態を記録します。代わりに 'this.setState({gameId}、()=> console.log(this.state));'を実行してください。 –