Я использовал withTracker для получения данных.Также используется реагирующий переключатель.Все работают хорошо для вставки.Сейчас я работаю над страницей обновления.Все данные могут обновляться без реакции-переключения, потому что я не могу показать статус обновления для коммутатора, который уже вставлен.Нам известно, что на странице обновления нужно показывать ранее вставленные данные.React-switch - это используемый конструктор, и я не могу вызвать данные в constractor.Я могу вызвать данные в render ().
Мой вопрос: как проверить, что поле переключателя отмечено / не отмечено?
Если проверенный переключатель необходимо проверить.Как я могу это сделать?
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);