この方法では、状態を変更しています
showAlert() {
if(this.state.userInput) {
this.setState(() => ({
toMyList: true
}))
}
状態が変更された場合のrenderメソッド。新しいコンポーネントにリダイレクトしています
render() {
const { toMyList } = this.state
if (this.state.toMyList === true) {
return <Redirect push to="/MyList" />;
}
}
ボタンをクリックしてshowalert()メソッドを呼び出しています。
<button class="btn-search" type="button" onClick={() => {this.showAlert()}}>
Search
</button>
反応ルーターを機能させるためにindex.jsに変更を加える必要がありますか?私の現在のindex.jsは次のとおりです。
ReactDOM.render(<App />, document.getElementById('root'));
serviceWorker.unregister();
「MyList」に関するルート定義は、ルート構造を定義する場所にある必要があります。App.jsまたは定義した他の場所で次のようになります。
render (){
return (
<div>
<Router>
<div>
<Switch>
<Route path="/" exact component={IndexPage} />
<Route path="/MyList" exact component={MyList}/>
</Switch>
</div>
</Router>
</div>
)
}
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加