我试图从一些http地址的JSON数组中获取一些值。因此,当我从输入字段中的地图放入时,我得到了一个Object而不是一个值。在输入字段之外,它工作正常。
<FormGroup>
<Label for="description">Description</Label>
<Input type="text" name="description" id="description" value={Object.keys(item.storeByClothes).map(clothes =>{return <p>{item.storeByClothes[clothes].description}</p>})}
onChange={this.handleChange} autoComplete="description"/>
</FormGroup>
{Object.keys(item.storeByClothes).map(clothes =>{return <p>{item.storeByClothes[clothes].description}</p>})}
在<FormGroup>
里面,我得到了对象。外在是必要的价值。我究竟做错了什么?
目前JSX转换器将<p>...
转换为React组件(对象),然后将其作为input
传递给value
。要显示变量的内容,浏览器调用.toString()
方法。所以最后你会看到“[Object object]”。根据您的需要,您需要进行不同的更改。
假设您希望在输入中看到HTML标记(如字符串),您应该将其设置为字符串(例如使用模板字符串):
.map(el => `<p>....`
或者,如果您需要将其视为实时HTML标记,则不应将其放入<input value