我的第一个反应应用：使用Codepen的计算器

Question

我暂时遇到2个主要问题。

第一个我不明白为什么，但是我不能使用任何<button>。我不得不将其切换为<input type="button"/>。

第二个是我的函数addDecimal无法正常工作。

addDecimal(){
  this.setState( prevState => {
    if (prevState.input.includes(".")) { 
      return prevState;
    } else { 
      console.log(prevState);
      return {
        input: prevState.input.concat("."),
        //result: prevState.result,
        //operation: prevState.operation,
      };
    }     
  });
}

当我触发该函数时，检查失败并仍然添加一个点。

这里是codepen链接https://codepen.io/Dali213/pen/QWbwbOb

Answer 1

默认情况下，<button>元素为type="submit"。因此，在这种情况下，您可以使用<button type="button">获得与<input type="button">相同的效果。 <button>元素更容易应用于CSS。

[具有type="submit"的按钮在过帐到<form>时很有用，而具有type="button"的按钮对非格式过帐有用。

---

关于您的第二个问题，我没有看到您所描述的问题。

当我单击调用addDecimal函数的按钮时，它第一次运行会正确添加.并注销console.log(prevState);，然后在调用该函数后的任何时间成功运行此代码：[C0 ]

如果if (prevState.input.includes(".")) {return prevState}已经包含小数，您可以通过提前退出来简化此功能：

state.input