在三元反应条件下不能呈现多图标

Question

我试图渲染一个mui图标，如果满足条件，但它正在崩溃我的应用程序。我相信这可能是因为我在{}中调用PriceCheckIcon。任何帮助吗?

<span
style={
Price > cinemaWorldPrice ? { color: "green" } : { color: "red" }
}
>
{error && Price > cinemaWorldPrice ? (
<div>{PriceCheckIcon}</div>
) : (
Number(cinemaWorldPrice).toFixed(2)
)}
</span>

错误信息:

react-dom.development.js:14757 Uncaught Error: Objects are not valid as a React child (found: object with keys {$$typeof, type, compare}). If you meant to render a collection of children, use an array instead

Answer 1

PriceCheckIcon需要在JSX表单中使用。

改变:

<div>{PriceCheckIcon}</div>

<PriceCheckIcon />