为什么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>
        </>
    }
}

我了解到，我们不能在function中更改任何输入标记的值，我们必须手动编写处理程序函数，但是在上面的代码片段中，我没有显式地更改值，那么为什么这里没有将默认行为应用于上面的代码段，我没有解释地更改输入标记的值，那么为什么这里没有应用function默认特性？

Answer 1

像这样转换您的输入：

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