children question

Question

User1034446946 posted

I am trying to get me head around children

I know i can wrap things using a hoc, but i have had issues with props and i have been looking at children and i just don't get it

lets say i have this html

<div className="form-group  row">
       <label className="col-sm-2 col-form-label">Start</label>
       <div className="col-sm-10">
            <Field name={`${name}[${index}].start`} component={StandardDatePicker} placeholder="Start"/>
            <InlineError name={`${name}[${index}].start`} />  
       </div>
</div>

now all i want to do is wrap the field and inlinerror in the html so i can reuse the html (all the examples I have seen are functionality), if someonecan point me in the write direct i would be appriciated.

or if there is a better way? (my question is coming from formik where it offers 3 different ways component, render or children, just trying to figure them you, i am thinking i need to go back to the es6 info)

Answer 1

User-474980206 posted

Every html element is converted to a function. One of the parameters to every function is children. To better understand, google react without jsx. Going thru these samples will explain children. 

hoc are a functional technique for function composition and not related to children.

Answer 2

User1034446946 posted

got it many thanks