时间戳

首页 > 解决方案 > 如何修复 ReactJS 上的 Button 仅在 firefox 上不起作用？

reactjs - 如何修复 ReactJS 上的 Button 仅在 firefox 上不起作用？

问题描述

reactjs中的每个按钮都不能在firefox中点击

<button className="btn btn-default" onClick={ this.onSignIn }>Sign In</button>
<button className="btn btn-default" ><Link to="/signup">Register</Link></button>

对于 onclick，这是我的功能

onSignIn() {
  //Grab state and post request to backend
  const {
    signInEmail,
    signInPassword
  } = this.state;

  this.setState({
    isLoading: true,
  });

  // POST request to backend
  fetch('/api/account/signin', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify({
      email: signInEmail,
      password: signInPassword,
    }),
  }).then(res => res.json())
    .then(json => {
      if (json.success) {
        setInStorage('the_main_app', { token: json.token });
        this.setState({
          signInError: json.message,
          isLoading: false,
          signInEmail,
          signInPassword,
          token: json.token,
        });
      } else {
        this.setState({
          signInError: json.message,
          isLoading: false,
        });
      }
    });

}

对于链接，我只是导入

import { Link } from 'react-router-dom';

在另一个浏览器（例如：chrome 或 safari）中，该按钮有效，但在 Firefox 中，当我单击该按钮时，它什么也没做。我得到了错误：

源映射错误。

标签： reactjsfirefoxbuttonreactive-programmingjquery-source-map

解决方案

尝试从按钮中删除链接。这就是导致问题的原因，因为您的按钮捕获了点击，但不知道如何处理它。

更好地使用你的行动。你应该能够做这样的事情......

import { push } from "react-router-redux";

export const changeUrl = location => dispatch => {
  dispatch(push(location));
};

推荐阅读