Tukukkk

I have used withTracker for data fetching. Also used react-switch. All are working well for the insert. Now I am working on the update page. All data can update without react-switch because I can't show update status for the switch which has already inserted. We are known for update page need show previously inserted data. React-switch is used constructor and I can't call data in constractor. I can call data in the render().

My question is how to check switch field is checked/ unchecked?

If the checked switch needs to check. How can I do that?

class EditEvent extends React.Component{

    //Date and Status switcher functions

    constructor(props) {

        super(props);

        this.state = {

          startDate: moment(),

          checked: true

        };

        this.handleChange = this.handleChange.bind(this);

        this.switchChange = this.switchChange.bind(this);

    }

    handleChange(date) {

        this.setState({

          startDate: date

        });

    }



    EventUpdate(e){

        e.preventDefault();

        let eventStatus = this.state.checked;

        console.log(eventStatus);



        Events.update(

            {_id : myId}, 

            {   status: eventStatus }, 

            function(err) {

              if (err){$("#message").removeClass("alert-success").addClass("alert-danger").text(err.reason);}

                else{$('.upload-event-from').trigger("reset");}

            }

        );

    }



    render(){

      const {

        loading,

        updateData,

      } = this.props;



      return loading ? null : (

          <div>

           <PrivateHeader title="Discover Page"/>

              <form className="upload-event-from plr-15" onSubmit={this.EventUpdate.bind(this)}>

              <div className="user-type">

                        Event Status



                        <label htmlFor="icon-switch">

                            <Switch

                                name="eventType"

                                checked={this.state.checked}

                                onChange={this.switchChange}

                                uncheckedIcon={

                                <div

                                    style={{

                                        display: "flex",

                                        justifyContent: "center",

                                        alignItems: "center",

                                        height: "100%",

                                        fontSize: 15,

                                        color: "white",

                                        paddingRight: 10

                                    }}>

                                    Public

                                </div>

                                }

                                checkedIcon={

                                    <div

                                        style={{

                                            display: "flex",

                                            justifyContent: "center",

                                            alignItems: "center",

                                            height: "100%",

                                            fontSize: 15,

                                            color: "white",

                                            paddingLeft: 10

                                        }}>

                                        Private

                                    </div>

                                }

                                offColor="#7e01ff"

                                onColor="#008000"

                                offHandleColor="#008000"

                                onHandleColor="#7e01ff"

                                height={30}

                                width={85}

                                className="react-switch"

                                id="icon-switch"

                            />

                        </label>

                    </div>

                    <span id="message" ></span>



                    <center>

                        <button type="submit" className="btn app-btn">Update</button>

                    </center>

              </form>

              <PrivateFooter title="Events Page"/>

          </div>

      );

  }



}





export default withTracker((props) => {

    const subscription = Meteor.subscribe('allowedData');

    const handle =  props.match.params.id;

    return {

        loading: !subscription.ready(),

        updateData: Events.findOne({_id:handle}),



    };

})(EditEvent);