javascript - Custom time input won't render -
i'm using admin-on-rest , trying write custom input component. format time value, that's not relevant question. current code don't see errors, can't render.
as loop through days of week, each open , close time create <field>
passing property's path name
, specifying custom render function component
.
from there want render <textfield>
. after i'll transforming input value, again that's tangential.
// set days of week const daysofweek = [ 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday', 'sunday' ] // time input component const rendertimefield = ({ input, label, meta: { touched, error }, ...custom }) => ( <textfield hinttext={label} floatinglabeltext={label} errortext={touched && error} source={input.name} {...input} /> ); // loop through days of week , render open/close time inputs // time object looks // hours: [{ day: "monday", open: "11:00am", close: "9:00pm" }, ...] const rendertimes = () => { return daysofweek.map((dayofweek, index) => ( <span key={index}> <field name={`hours[${index}].open`} component={rendertimefield} label={`${dayofweek} open time`} /> <field name={`hours[${index}].close`} component={rendertimefield} label={`${dayofweek} close time`} /> </span> )) }; // later, render it... <tabbedform> {rendertimes.call(this)} </tabbedform>
from that, renders x7:
<div class="aor-input-undefined"> <span> <span></span> <span></span> </span> </div>
Comments
Post a Comment