我刚刚有一个bug，会导致我的应用程序崩溃，因为我有{object.field}在JSX，但{object.field}是一个对象类型，因此不是一个有效的React子
我正在使用esLint和Typescript，所以静态检查器意识到我试图在JSX中输出对象类型的事实
是否有一种方法可以直接在IDE中警告此错误?
我试着看看IDE扩展，但找不到任何有用的。
当你试图将一个对象作为prop或子对象直接传递给React组件时，会抛出这个错误。你需要把它转换成一个有效的React子元素，把它呈现为一个React元素
很可能你的字段也是某种对象，也包括数组，React不能自己渲染你必须迭代它的值，并将它们呈现为React元素例如，假设object.field看起来像
const staff = [
name: 'Billy', role: 'admin'},
name: 'Sally', role: 'contributor'}
];
要呈现它，我将使用.map()方法迭代列表中的每个对象并将其呈现为HTML元素
{staff.map(user => (
<div key={user.name}>
<p>{user.name}</p>
<p>{user.role}</p>
</div>
))}
React不知道如何渲染JavaScript对象，这就是它抛出错误的原因。
如果你在object.field中发送一个React元素，你可以通过调用React.isValidElement来检查它的有效性。
有关其工作原理的详细信息可以在beta文档中找到(这是文档，而不是处于beta阶段的函数)。
它会检查object.field的值是否为React元素