How to set default Checked in checkbox ReactJS?

Question

I\'m having trouble to update the checkbox state after it\'s assigned with default value checked="checked" in React.

var rCheck = React         


        

Answer 1

Here's a code I did some time ago, it might be useful. you have to play with this line => this.state = { checked: false, checked2: true};

class Componente extends React.Component {
  constructor(props) {
    super(props);

    this.state = { checked: false, checked2: true};
    this.handleChange = this.handleChange.bind(this);
    this.handleChange2 = this.handleChange2.bind(this);

  }  

  handleChange() {
    this.setState({
        checked: !this.state.checked      
    })
  }

  handleChange2() {
    this.setState({
        checked2: !this.state.checked2      
    })
  }

  render() {
    const togglecheck1 = this.state.checked ? 'hidden-check1' : '';
    const togglecheck2 = this.state.checked2 ? 'hidden-check2' : '';

    return 

        

        Check 1
        
        Check 2
        
      

      
show hide div with check 1
      
show hide div with check 2

    
;
  }
}

ReactDOM.render(
  ,
  document.getElementById('container')
);

CSS

.hidden-check1 {
  display: none;  
  }

.hidden-check2 {
  visibility: hidden;
}

HTML

here's the codepen => http://codepen.io/parlop/pen/EKmaWM