javascript - 声明后向 JSX.Element 添加属性

Question

如果我有一个元素，比如这样的字典:

let item = {
    element: <myElement/>,
    color: "#0e76a8"
}

我可以在 render() 中向 item.element 添加样式属性吗？

我以为这样的东西会很好用，但事实并非如此

return (
        <div>
            {<item.element style={{ color: "item.color" }/>}
        </div>
    );

JSX 或 React 有办法实现我想要的吗？

注意:我的目标是无法更改 item.color。只是我需要抽象，因为在我的代码中，我将拥有不同 item 变量的列表，并使用所需的属性渲染每个变量，我不想在 JSX 中对其进行硬编码，以便更容易在其中找到以防 future 发生任何变化。

Answer 1

正如您所知，放置 <和> JSX 中的函数引用将应用该功能组件。

您不想在定义item时应用您的组件对象，您只想保留对它的引用以供以后应用:

let item = {
    element: myElement,
    color: "#0e76a8"
}

此外，如noted in comments ，您正在设置 color CSS样式为字符串"item.color" ，而我们可以放心地假设您的意思是 color: item.color