React redux form FieldArray.map() does not work

Question

I'm trying to create FieldArray. I got sth like this:

<form>
  <FieldArray
    name="styles"
    component={this.renderStyles}
  />
</form>

and then:

renderStyles = (props) => {
  return(
    <ul>
    {props.fields.map((style, index) =>{
    console.log(style)
    return(
      <li key={style} className="field-item">
        <label>{style}</label>
        <Field
            name={`${style}`}
            component="input"
            type="checkbox"
        />
      </li>)
  }
)} 
</ul>
)}

I also do initialize the values for FieldArray like this:

initialValues:{styles:[{style:'somestyle', img:'someimgurl'}]}

However the console.log(style) in renderStyles showes me only styles[0] as a string. No way to obtain the object. I tried different ways. HELP DERP! Please :)

ok, never mind. After hours of tortures props.fields.getAll().map... does the trick finally... Isn't it a bug in FieldArray though? — zmaselke
– zmaselke, Commented Jan 23, 2018 at 20:30

zmaselke · Accepted Answer · 2018-01-23 20:34:38Z

1

ok, never mind. After hours of tortures props.fields.getAll().map... does the trick finally... Isn't it a bug in FieldArray though?

answered Jan 23, 2018 at 20:34

zmaselke

9111 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

React redux form FieldArray.map() does not work

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related