Ghost Ghost
Ghost Ghost

Reputation: 81

how do i map over items in an input feild?

I am making a form that sends over the shipping details of a user . I am however finding it difficult to map over the shipping other in an input field that is immutable(read only). I keep getting this in the input field [object, object] in the browser . I want the details of the objects to show instead.

Here is a snippet of the code

<div class="telephone">
                <label for="name"></label>
                <input
                  type="text"
                  name="username"
                  value={items.map((item, id) => (
                    <Payment
                      key={id}
                      name={item.name}
                      price={item.price}
                      itemSize={item.itemSize}
                      count={item.count}
                    />
                  ))}
                  readonly
                />
              </div>

Upvotes: 0

Views: 317

Answers (1)

Ivo
Ivo

Reputation: 2510

HTML input types are expecting text as value and you are passing JSX component to it, that's why it's displaying [Object, object]. Not sure what you want to achieve, but input type='text' need text as value.

https://www.w3schools.com/tags/tag_input.asp

Upvotes: 1

Related Questions