我想在此HTML中显示每个对象的名称:
{subjects.map((item, i) => ( <li className="travelcompany-input" key={i}> <span className="input-label">{ item.name }</span> </li> ))}
但这会引发错误subjects.map is not a function。
首先,我必须定义对象的键,在该对象处创建一个 键数组,在这里我要循环浏览并显示subject.names。
我还尝试过的是:
{Object.keys(subjects).map((item, i) => ( <li className="travelcompany-input" key={i}> <span className="input-label">key: {i} Name: {subjects[i]}</span> </li> ))}
调用Object.keys时返回对象键的数组。
Object.keys
Object.keys({ test: '', test2: ''}) // ['test', 'test2']
调用时,Array.map该函数接受2个参数。1.项目,2. 索引。
Array.map
当您想要获取数据时,您需要使用item而不是i
item
i
{Object.keys(subjects).map((keyName, i) => ( <li className="travelcompany-input" key={i}> <span className="input-label">key: {i} Name: {subjects[keyName]}</span> </li> ))}