Redux-form: Can't get children from Field component

Question

I'm trying to render a select, and want to be able to do something like this to add options:

<Field component={RenderSelect} name="subjects" label="Subjects">
        <option value="maths">Maths</option>
        <option value="english">English</option>
</Field>

I have a createRenderer function:

const createRenderer = render => ({input, name, label, children}) => {
  return (
    <div key={name}>
    <label htmlFor={name}>{label}</label>
    {render(input, name, children)}
    </div>
  )
},

and my RenderSelect looks like this:

const RenderSelect = createRenderer((input, name, label, children) => {
    return (
      <select name={name} {...input}>
      {children}
      </select>
    )
})

I was under the impression that I could just destructure the children prop off the Field like I do for input , name , label , etc, although this does not seem to work. When I run the code, no options appear in my select, and an inspection of the DOM verifies that there are no options. Any help would be much apprecited. Thanks in advance!

Answer 1

You just need to remove your label parameter

const RenderSelect = createRenderer((input, name, children) => {
    return (
        <select name={name} {...input}>
            {children}
        </select>
    )
});