ReactのonClickハンドラにもかかわらずhistory.back（）がクリックを待たずに表示される

Question

私はReactとMeteorでレンダリングしている特定のビューに対して、戻るボタンのリンクを<a href='#' onClick={history.back()} > で作成しようとしています。 私の目標は、パラメータを渡すことなく、ユーザーがブラウザの戻るボタンを使用することなく、前のページに戻ることができるようにすることです。

問題：このコードを実行するときに、バックボタンでビューもレンダリングしないとhistory.back()が自動的に起動するonClickイベントを待っているのではなく、トリガされるようです（ユーザーがボタンをクリック）

import React from 'react'; 

const UnitButtonComponent =() => { 
    return (
    <div> 
     <a href='#' onClick={history.back()} > 
      <button type='button' name='go back' /> 
     </a> 
    </div> 
    ) 
}; 

export default UnitButtonComponent; 

私はルーターとしてflowrouterも使用しています。

Answer 1

問題はhistory.backの後の（）です。レンダリングメソッドが呼び出されると、{}内の要素が評価されます。

（）を削除すると、onClick propにhistory.back関数が割り当てられ、期待通りに機能します。

Answer 2

あなたがメソッドを実行している、すぐに

ではなく、これを実行します。

<a href='#' onClick={() => history.back()} >