vendredi 26 mai 2017

Save the state of the CheckBox in react native application (checked or unchecked ) / Invalid prop supplied to checkbox

i just implemented the checkbox component from native base in my react native app. Every time i check/uncheck the checkbox, some variable change its status (true or false) and then stored. Based on that value stored in the asyncStorage,i can do some changes in the app and it works fine.

The problem I'm facing now is : I need the checkbox to remain checked / unchecked while using the app (even if changing from one page to another) and it can not change while the user didn't change it (it's always going back to the default value once changing the page ) I'm storing the variable as string but apparently checkbox accept only boolean variables. PS: I tried to store the status as boolean but it's not working Here is the code :

constructor(props) {
        super(props);
        this.state ={ status: false }
};

 toggleStatus() 
{
        this.setState({
            status: !this.state.status
        });
     AsyncStorage.setItem("myCheckbox",JSON.stringify(this.state.status));
}

render(){
return(

.... 
    <CheckBox checked={this.state.status}
              onPress={() => this.toggleStatus()} />

);}

I even tried to change the status like this :

componentWillMount(){
        AsyncStorage.getItem('myCheckbox').then((value) => {
            JSON.parse(value)
            this.setState({
                status: value
            });
            if (this.state.status == 'false') {
                this.setState({
                    status: false
                });
            }
            else if (this.state.status == 'true') {
                this.setState({
                    status: true
                });
            }
            else {
                this.setState({
                    status: false
                });
            }   
        });

    }

But, it keeps throwing a warning : enter image description here




Aucun commentaire:

Enregistrer un commentaire