Reactjs 绑定时object.property.toString（）起作用，为什么object.property不起作用？

我是个十足的初学者

这很有效，我引用了opportunity.title.toString（）（这似乎是多余的）：

但是，如果我在没有.toString（）的情况下使用“property”，则这不起作用。有人能帮我理解为什么吗

function BindOpportunities(opportunities) {
    const listItems = opportunities.map((opportunity) =>
       <li key="{opportunity.opportunityId}">{opportunity.title}</li>
    );

    ReactDOM.render(
        <ul>{listItems}</ul>,
        document.getElementById('opportunity-list-view')
    );
}

功能绑定商机（商机）{
const listItems=opportunities.map（（opportunity）=>
{opportunity.title}
);
ReactDOM.render(
{listItems}
，
document.getElementById（'opportunity-list-view'）
);
}

注意：作为对评论的回应，我得到警告：

react dom.development.js:82警告：遇到两个具有相同密钥的子项，

{opportunity.opportunityId}

。键应该是唯一的，以便组件在更新期间保持其标识。非唯一键可能会导致复制和/或忽略子项-不支持该行为，并且可能在将来的版本中更改

---

首先，不要在子节点中使用

ReactDOM.render（）

，您只需要在根节点中使用它，比如

，然后子节点/组件只需要在函数组件中返回jsx，在类基组件的情况下从render方法返回

函数绑定机会（{opportunities}）{
返回(

{opportunities.map（（opportunity）=>
{opportunity.title}
)}

);
}
持续机会=[
{
“opportunityId”：“00000000-0000-0000-0000-00000000”，
“标题”：“帮助我们传播有关ImmuneAndReadyToHelp.com的工作！”
}
];
函数应用程序（）{
返回(
);
}
ReactDOM.render（，document.getElementById（'root'））

您可以从

opportunities

中共享一个对象吗？键的正确语法为

键={opportunity.opportunityId}

，不带任何quotes@ZohaibIjaz，我添加了那个细节。@sarthak aggarwal，我添加了那个细节。没有

.toString（）

，您会遇到什么错误？谢谢，不过，您能解释一下为什么我会使用document.getElementById（'root'）而不是document.getElementById（'opportunity-list-view'）？我不知道你的场景是什么，也不知道你是否在做作业，你可能需要的正是那种代码，但在大多数情况下，react应用程序有一个单亲根dom元素

，通常id为

root

，所以我选择了

ReactDOM.render（，document.getElementById（'root'））；

。这将取决于您希望将整个应用程序装载到何处，index.htmlthe安排中的根节点的id是多少。在我的实际示例中，这种安排会出现一条模棱两可的错误消息。有没有一种方法可以简化答案，以便如果我有a和数组常量B=[{“num”：“1”}，{“num”：“2”}]；我可以根据数据“B”将div子项添加到“A”？

<li>Help Us Spread The Work About www.ImmuneAndReadyToHelp.com!</li>

{"opportunityId":"00000000-0000-0000-0000-000000000000","title":"Help Us Spread The Work About ImmuneAndReadyToHelp.com!"}

function BindOpportunities(opportunities) {
    const listItems = opportunities.map((opportunity) =>
       <li key="{opportunity.opportunityId}">{opportunity.title}</li>
    );

    ReactDOM.render(
        <ul>{listItems}</ul>,
        document.getElementById('opportunity-list-view')
    );
}