Question

我有一个带有onClick方法的组件，我想根据我在组件中获得的属性设置方法conditionaly。这是代码如下所示：

      <Image
        className={styles.editIcon}
        src={openForm ? editPeriodDisabled : editPeriod}
        onClick={() => toggleFormCallback(id)}
        alt="Rediger periode"
      />

我有一个布尔属性openForm，我希望通过它在Image组件的onClick属性中设置该方法。所以，例如：

openForm ? null : toggleFormCallback(id)

但是，不确定如何使用箭头功能？

Answer 1

您可以使用bind()：

onClick={openForm : null ? toggleFormCallback.bind(this, id)}

bind()返回一个与原始函数相同但绑定到给定上下文的新函数。您还可以绑定部分或全部参数。

Answer 2

最简单的解决方案。

  <Image
    className={styles.editIcon}
    src={openForm ? editPeriodDisabled : editPeriod}
    onClick={() => { if (openForm) { toggleFormCallback(id) } }}
    alt="Rediger periode"
  />

在组件中设置on click方法conditionaly

2 个答案: