ウェブサイト検索

javascript - react-route の Link を使ってページをリフレッシュする方法


私は react-route の Link を使ってページをリフレッシュしようとしています。しかし、私が実装した方法では、URL が一歩戻ってしまいます。(例えば、URL が ../client/home/register の場合、リロードボタンを押すと ../client/home に移動します)

以下は私のコードです

const AppErrorPage = () => (
    <div>
    <div style={ styles.container }>
        <h2>Error</h2>
        <p> Something went wrong, please reload the page </p>
        <div>
         <Link to="" refresh="true">
            <span>Reload</span>
          </Link>
        </div>
    </div>
    </div>  
);

回答 #1

ページをリフレッシュするには、react-routerは必要なく、シンプルなJSでできます:

window.location.reload();

Reactコンポーネントでビューを再レンダリングするには、propsやstateで更新を発火させるだけです。

回答 #2

こんなふうに試してみて。

あなたは onClick() に関数を値として渡さなければなりません

あなたのボタン:

<button type="button" onClick={ refreshPage }> <span>Reload</span> </button> 

refreshPage 関数:

function refreshPage(){ 
    window.location.reload(); 
}

回答 #3

クエリが成功した後に、これを簡単に実行できます。

window.location.reload();

関連記事