更新 React 上下文状态中的单个项目

Question

所以我有一个以下格式的上下文：

class UserProvider extends Component {
    constructor(props) {
        super(props)

        this.initialize = (details) => {
            this.setState(state => {
                //Setting each item individually here
                //e.g state.a = details.a
            })
        }

        this.editA = () => {
            this.setState(state => {
                //change A here
            })
        }

        this.editB = () => {
            this.setState(state => {
                //Change B here
            })
        }

        this.state = {
            a: null,
            b: null,
            editA: this.editA,
            editB: this.editB
        }
    }

    render() {
        return (
            <User.Provider value={this.state}>
                {this.props.children}
            </User.Provider>
        )
    }
}

所以对于每个状态，我都有一个单独的函数来更新它。如果我只想更新一个状态，我该怎么办？

Answer 1

考虑实现一个通用函数，这样您就可以控制您的键和对应的值。

即

const changeField = (key, value) => this.setState({ [key]: value});

函数调用

changeField('a','value_a')
changeField('b','value_b')

更新 React 上下文状态中的单个项目

Updating a single item in React context state

javascript

state

node.js

reactjs

react-context