score:0

class Parent extends Component{
    constructor(props) {
        super(props);
        this.state = { allChecked: false ,
            childItems = [ { text: 'one', selected: false }, 
                { text: 'two', selected: false }, 
                { text: 'three', selected: false }
            ]
        };
    }

    componentWillReceiveProps(newProps) {
        if (!this.props.checkAll && newProps.checkAll) {
            this.setState({ allChecked: newProps.checkAll });
        }
    }

    handleCheckChange(itemSelected, selected) {
        allChecked = false;
        let index = this.state.childItems.findIndex( (item) => item.text === itemSelected.text );
        let newitem = Object.assign({}, this.state.childItems[index]);
        newitem.selected = selected;

        if (selected === true){
            if (this.state.childItems.findIndex((item) => item.selected === false) === -1) {
                allChecked = true;
            }
            this.setState
        }

        this.setState({ allChecked: false,
            childItems: [
                ...this.state.childItems.slice(0, index),
                newItem,
                ...this.state.childItems.slice(index+1)
            ]
        });
    }

    render() {
        return {
            <div>
                <div>
                    <input type="checkbox" name="parent" value={this.state.allChecked} /> Parent
                </div>
                <div>
                    <ChildComponent items={this.state.childItems} onCheckChange={ (itemSelected) => handleCheckChange(itemSelected) } />
                </div>
            </div>
        };
    }
}

Related Query

More Query from same tag