Question

我遇到需要在点击链接时触发谷歌分析事件的情况。我为此目的写了一个处理程序：

handleClick(e){
  e.preventDefault();
  // --------------------------
   GA code ...
  // --------------------------
  // now how can I re-eanble the link
  // e.target.click() and similar methods are not working for me

}

但是在GA事件被触发后，我找不到从链接中取消绑定preventDefault的方法（使用React的“链接”组件创建）。

任何指针都会有所帮助。

Answer 1

您可以尝试更新状态。下面的示例我试图有条件地附加事件处理程序.. 我在第一次调用后删除了附加到按钮onClick事件的处理程序。

我也试过有条件地为链接执行 e.preventDefault 。

https://codesandbox.io/s/MQnoVJKJR

import React from 'react';

export default class Hello extends React.Component {
  state = {
    btnClicked: false,
    linkClicked: false,
  };
  constructor() {
    super();
  }
  handleClick(e) {
    e.preventDefault();
    alert('button clicked');
    this.setState({
      btnClicked: true,
    });
  }
  handleLinkClick(e) {
    if (!this.state.linkClicked) {
      e.preventDefault();
    }
    this.setState({
      linkClicked: true,
    });
  }
  render() {
    return (
      <div>
        <div>
          <button
            onClick={!this.state.btnClicked && this.handleClick.bind(this)}> // Binding onClick event to state change

            Click Me
          </button>
        </div>
        <a
          href="https://www.google.co.in"
          target="_blank"
          onClick={this.handleLinkClick.bind(this)}
        >
          Go to Google.com
        </a>
      </div>
    );
  }
}

在reactJS方法中取消注册e.preventDefault

1 个答案: