从 class 组件迁移到功能组件，setState as useState

Question

从 RCC 迁移到 RFC 时，是否有任何简单的方法来设置状态变量，如下所示？

所以在我的 RCC 中我有类似的东西。

changeState(e) {
    this.setState({
        [e.currentTarget.name]: e.currentTarget.value
    })
}

是否可以将其写在 RFC 中？

Answer 1

怎么样

import { useState, useCallback } from 'react';

const [state, setState] = useState({});
const changeState = useCallback((e) => {
    setState(oldState => ({ ...oldState, [e.currentTarget.name]: e.currentTarget.value }))
}, [])

Answer 2

我有一个 handleChange 函数，它接收一个 set 函数作为参数并将其捆绑为它自己的自定义挂钩。

handleChange = (setFunction, e) => {
  setFunction(e.target.value)
}

然后在你的组件中你可以使用像

这样的东西

event => handleChange(setName, event)

从 class 组件迁移到功能组件，setState as useState

Migrating from class component to functional component, setState as useState

reactjs

react-hooks