In React I am changing the ‘status’ field which works, but only allows two possible options:
export default class FutureTaskSingle extends TrackerReact(Component) {
render() {
const checkBoxFlag = (moment(this.props.futuretask.start_date).startOf('minute')).isAfter(moment().startOf('minute')) ? 0 : 1;
const futuretaskClass = (moment(this.props.futuretask.start_date).startOf('minute')).isAfter(moment().startOf('minute')) ? "" : "checked";
const status = (moment(this.props.futuretask.start_date).startOf('minute')).isAfter(moment().startOf('minute')) ?
<span className="noncompleted">TO DO</span> :
<span className="completed">TEMP CHANGE GROUP</span>;
return (
<li className={futuretaskClass}>
<input type="checkbox"
readOnly={true}
checked={checkBoxFlag}/>
{status}
<hr></hr>
</li>
)
}
}
But changing to if-else statement to allow for more cases for the ‘status’ fails?:
export default class FutureTaskSingle extends TrackerReact(Component) {
render() {
const checkBoxFlag = (moment(this.props.futuretask.start_date).startOf('minute')).isAfter(moment().startOf('minute')) ? 0 : 1;
const futuretaskClass = (moment(this.props.futuretask.start_date).startOf('minute')).isAfter(moment().startOf('minute')) ? "" : "checked";
if ( (moment(this.props.futuretask.start_date).startOf('minute')).isAfter(moment().startOf('minute')) ) {
const status = <span className="noncompleted">TO DO</span> ;
} else {
const status = <span className="completed">TEMP CHANGE GROUP</span>;
}
return (
<li className={futuretaskClass}>
<input type="checkbox"
readOnly={true}
checked={checkBoxFlag}/>
{this.props.futuretask.number}
{status}
<hr></hr>
</li>
)
}
}
No error messages, it just doesnt render?