簡単な検索を作成しようとしています。検索ボタンをクリックすると、新しいコンポーネントにリダイレクトされますが、リダイレクトがまったく機能しませんか?

アビ

この方法では、状態を変更しています

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]

編集
0

コメントを追加

0

関連記事

Related 関連記事

ホットタグ

アーカイブ