web-dev-qa-db-ja.com

ReactJS-リダイレクトコンポーネントで小道具を渡す

Redirectコンポーネントで小道具をURLで公開せずに渡すにはどうすればよいですか？

このような<Redirect to="/order?id=123 />"？ react-router-domを使用しています。

javascriptreactjsreact-router-dom
17
Michiel

次のようにRedirectでデータを渡すことができます：

<Redirect to={{
            pathname: '/order',
            state: { id: '123' }
        }}
/>

そして、これはあなたがそれにアクセスする方法です：

this.props.location.state.id

API dcoumentation Redirect/Historyプロパティで状態やその他の変数を渡すため。

ソース： https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/api/Redirect.md#to-object

43
Sakhi Mansoor

次のようなブラウザ履歴状態を使用できます。

<Redirect to={{
    pathname: '/order',
    state: { id: '123' }
}} />

その後、this.props.location.state.idからアクセスできます

ソース： https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/api/Redirect.md#to-object

10
Anas