React开发计算器时input输入框无法正常返回值该如何解决？

你遇到的问题是两个错误导致的：

1. 输入框没有和state的equation字段绑定，输入的内容不会同步到state里，所以this.state.equation一直是初始的空值，打印出来自然没有内容。
2. Enter按钮的onClick绑定写法错误，既没有执行handleInput函数，就算执行了，按钮的事件对象也拿不到输入框的内容，完全是无效逻辑。

修复方法 #

1. 给input标签添加双向绑定，让输入内容实时同步到state：

// 把原来的input替换成这个
<input type="text" value={this.state.equation} onChange={this.handleInput}></input>

2. 删除Enter按钮上无效的onClick绑定，这个按钮现在不需要负责同步输入，如果你后续要用来触发计算，可以单独写对应的处理函数：

// 把原来的Enter按钮替换成这个
<button>Enter !</button>

修改完成后，你在输入框输入内容，再点击「Log in console」按钮就能正常打印输入的表达式了。
如果后续要实现表达式计算功能，个人练习场景可以直接用eval()处理this.state.equation的值，生产环境使用的话需要注意安全风险，要做表达式合法性校验。

内容的提问来源于stack exchange，提问作者Dev