当按钮在表单元素之外时，bowserHistory.push不工作

当按钮在表单元素之外时，browserHistory.push不工作的原因是，browserHistory.push是React Router库中的一个方法，用于在应用程序中进行页面导航。它通过修改浏览器的历史记录来实现页面跳转。

然而，当按钮位于表单元素之外时，可能存在以下几种情况导致browserHistory.push不起作用：

1. 按钮的点击事件未正确绑定：确保按钮的点击事件已正确绑定到调用browserHistory.push的函数上。可以通过在按钮的onClick属性中指定相应的处理函数来实现。
2. 表单元素的默认提交行为：如果按钮位于一个表单元素内部，并且该表单元素具有默认的提交行为（例如，按下回车键或点击按钮会触发表单的提交），则可能会导致browserHistory.push无法正常工作。这是因为表单的默认提交行为会刷新页面，而不是执行browserHistory.push导航操作。为了解决这个问题，可以在表单元素的onSubmit事件中阻止默认的提交行为，或者将按钮移出表单元素。
3. browserHistory未正确配置：在使用browserHistory.push之前，需要确保已正确配置browserHistory。在React Router v4及以上版本中，可以使用BrowserRouter组件来包裹应用程序的根组件，并将browserHistory作为其属性传递给BrowserRouter。例如：

import { BrowserRouter } from 'react-router-dom';
import { createBrowserHistory } from 'history';

const history = createBrowserHistory();

ReactDOM.render(
  <BrowserRouter history={history}>
    <App />
  </BrowserRouter>,
  document.getElementById('root')
);

1. 路由配置错误：如果browserHistory.push仍然不起作用，可能是由于路由配置错误导致的。请确保路由配置正确，并且目标路径在路由配置中存在。

总结起来，当按钮在表单元素之外时，browserHistory.push不工作可能是因为按钮的点击事件未正确绑定、表单元素的默认提交行为、browserHistory未正确配置或路由配置错误。需要仔细检查代码，确保以上问题都得到正确处理。