How to use custom component in redux-form?

Question

In my redux-form app I have a Field that should be a custom component:

import Name from './NameComponent'
..

<Field
            name="boer"
            component={Name}
            type="text"
            placeholder="First Name"
/>

The component is NameComponent:

import React from 'react'
const Name= field => <div><input type="text">fill in here:</input></div>
export default Name;

When I run this CRA app I get this error, why? :

Uncaught Invariant Violation: input is a void element tag and must neither have `children` nor use `dangerouslySetInnerHTML`. Check the render method of Name.

flppv · Accepted Answer · 2019-03-24 05:07:53Z

2

Use

const Name = field => <input type="text" {...field.input} />

Also I encourage you to learn this and this sections of Redux Form docs

answered Mar 24, 2019 at 5:07

flppv

4,2995 gold badges40 silver badges58 bronze badges

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

Collectives™ on Stack Overflow

How to use custom component in redux-form?

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