react18的受控组件有没有什么新特性

// 受控组件:其值受到React控制的表单元素
// 操作文本框的值
class App extends React.Component {
    state = {
        txt: '',
        content: '',
        city: 'bj',
        isChecked: false,
    }

![img](https://img-mid.csdnimg.cn/release/static/image/mid/ask/573973196876141.png "#left")

    // 处理多表单元素的变化 
    handleForm = e => {
        // 获取当前DOM对象
        const target = e.target
        // 根据类型获取值
        const value = target.type === 'checked'
        ? target.checked
        : target.value
        // 获取name
        const name = target.name
        this.setState({
            [name]: value
        })
    }

    render() {
        return(
            <div>
                {/* 文本框 */}
                <input type="text" name="txt" value={this.state.txt} onChange={this.handleForm}/>
                <br/>

                {/* 富文本框 */}
                <textarea name="content" value={this.state.content} onChange={this.handleForm}>textarea>
                <br/>

                {/* 下拉框 */}
                <select name="city" value={this.state.city} onChange={this.handleForm}>
                    <option value="sh">上海option>
                    <option value="bj">北京option>
                    <option value="gz">广州option>
                select>
                <br/>

                {/* 复选框 */}
                <input type="checkbox" name="isChecked" checked={this.state.isChecked} onChange={this.handleForm} />
            div>
        )
    }
}

// 渲染组件
const root = ReactDOM.createRoot(document.getElementById('root'))
root.render(<App />)

img

基本上新的特性比较少,主要还是考虑和之前的一个兼容。

改写hook吧 大兄嘚