首页 > 解决方案 > 反应历史挂钩不起作用

问题描述

React Hook "useHistory" 在函数 "header" 中调用,它既不是 React 函数组件也不是自定义 React Hook 函数

下面是我的代码

import { Link, useHistory } from 'react-router-dom'
function header() {
    let history = useHistory()
    return (
        <header>
            <div className="header_buttons">
                <Link onClick={history.push('/auth/login')} to='/auth/login'>
                    <a href="" className='primary-link'>Login</a>
                </Link>
            </div>
        </header>
    )}
export default header

下面是我得到的错误

Failed to compile.

./src/Header/header.js
  Line 6:19:  React Hook "useHistory" is called in function "header" which is neither a React function component or a custom React Hook function  react-hooks/rules-of-hooks

标签: javascripthtmlreactjs

解决方案


React 组件必须大写。将其重命名为Header.

function Header() {
   let history = useHistory();

   return (...);
}

推荐阅读