首页 > 解决方案 > 设置材质 UI 复选框的初始值

问题描述

    function mapStateToProps(state) {
        return {
                  model: Selectors.Quotes.getCurrentQuote(state),

        };
    }

    class Customer extends Component {
        state = {
            checkedEnergyConcessionHolder: false

        };

        handleChange = name => event => {
            this.setState({ [name]: event.target.checked });
        };

        render() {
            const { model} = this.props;
            const { checkedEnergyConcessionHolder  } = this.state;
            return (
                            <Checkbox>
                                label="Concession holder"
                                value="checkedEnergyConcessionHolder"
                                checked={checkedEnergyConcessionHolder}
                                onChange={
                                    this.handleChange('checkedEnergyConcessionHolder')
                                }
                            </Checkbox>
            );
        }
    }

    export default withStyles(panelTheme)(connect(mapStateToProps)(Customer));

如何初始化复选框的值?我需要来自模型的默认值(等于 model.EnergyConcessionHolder) 我该怎么做?

标签: reactjsreduxreact-reduxmaterial-uiredux-form

解决方案


只需将其添加为您的mapStateToProps方法的一部分:

function mapStateToProps(state) {
    const model = Selectors.Quotes.getCurrentQuote(state);
    return {
        model,
        checkedEnergyConcessionHolder: model.EnergyConcessionHolder,
    };
}

推荐阅读