Question

我有一个事件监听器，监听点击事件，并且正在运行此功能：

  handleClick = e => {
    const neutralState =
      "slds-button slds-button_neutral slds-m-around_xx-small";
    const selectedState =
      "slds-button slds-button_brand slds-m-around_xx-small";
    const target = e.currentTarget;
    const targetClass = target.getAttribute("class");
    const value = target.innerHTML;

    if (targetClass === neutralState) {
      target.setAttribute("class", selectedState);
      this.saveData(value, this.props.modifier);
    } else if (targetClass === selectedState) {
      target.setAttribute("class", neutralState);
      this.removeData(value, this.props.modifier);
    }
  };

  saveData(value, modifier) {
    if (modifier === "kinds of loss") {
      this.props.dispatch(addKindsOfLoss(value));
    } else if (modifier === "type of loss") {
      this.props.dispatch(addTypeOfLoss(value));
    } else if (modifier === "water loss") {
      this.props.dispatch(addWaterLoss(value));
    }
  }

  removeData(value, modifier) {
    if (modifier === "kinds of loss") {
      this.props.dispatch(removeKindsOfLoss(value));
    } else if (modifier === "type of loss") {
      this.props.dispatch(removeTypeOfLoss(value));
    } else if (modifier === "water loss") {
      this.props.dispatch(removeWaterLoss(value));
    }
  }

saveData和removeData操作基本上是添加项目或从数组中删除项目。

因此，在我的handleClick函数中，如果我注释掉this.saveData和this.removeData的函数，则按钮将按预期更改。但是，如果使用saveData和removeData函数，则不会发生更改。基本上，按钮处于中立状态。

有人看到我在做什么错吗，或者对如何更改按钮状态并触发操作有任何建议？

Answer 1

我用您的代码段编写了一个小程序。它按预期工作。它将按预期更改按钮中的类。

group1: 6.985664367675781e-05
group2: 1.9788742065429688e-05

我不确定特殊方法addKindsOfLoss，removeKindsOfLoss等是否存在任何问题，但是触发了单击操作。

如何更改按钮状态并将操作分派到redux？

1 个答案: