javascript - react 没有箭头的JavaScript箭头功能？

我不明白这在JavaScript中如何运作

renderMarkButton(type, icon) {

它看起来像一个箭头功能，但没有箭头。这里是上下文：

class HoverMenu extends React.Component {

  renderMarkButton(type, icon) {
    const { editor } = this.props
    return (
      <div className="editorButton"
            onMouseDown={event => this.onClickMark(event, type)}>
        <FontAwesomeIcon color="#666" active={isActive}
            className="editorButton" icon={icon}  />
        </div>
    )
  }
  render() {
    return (
      <div>
        {this.renderMarkButton('bold', {...faBold})}
      </div>
    )
  }
}

我也对

  const { editor } = this.props

我相信它来自Slate。在这种情况下，我希望this.props为{type，icon}。

最佳答案

箭头和绑定方法对于将它们作为回调传递给以后调用非常有用：

<Component onClick={this.clickHandler}/>

renderMarkButton不是这种情况，因为它是在与正确的this上下文一起使用的地方调用的：

this.renderMarkButton('bold', {...faBold})

renderMarkButton是类原型方法。它不像箭头功能那样工作，因为它没有绑定到上下文。在错误的上下文中调用它会导致错误，因为将没有this.props对象：

const unboundFunction = this.renderMarkButton;
unboundFunction('bold', {...faBold});

关于javascript - react 没有箭头的JavaScript箭头功能？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/54477614/