为什么react默认表单功能不执行?

Question

import React from "react";
export default class Form extends React.Component{
constructor(props) {
super(props);
this.inputRef = React.createRef();
this.state = {
value:""
}
}
// handleClick
handleClick = (e) => {
this.setState({ value: e.target.value })
console.log(e.target.value)
}
render() {
return <>
<h2>Typig ... {this.state.value}  </h2>
<form>
<input type="text" ref={this.inputRef} onChange={this.handleClick}  />
</form>
</>
}
}

我了解到，我们不能改变任何输入标签的值在反应，我们必须通过编写处理程序函数手动做到这一点，但在上面的代码片段我没有改变值显式那么为什么这里的默认行为不应用在上面的代码片段中，我没有显式地改变输入标签的值，那么为什么react默认特性在这里不应用

Answer 1

像这样变换你的输入:

<input type="text" value={this.state.value} ref={this.inputRef} onChange={e => this.handleClick}  />