带有数据的对象仍返回Object.keys（）未定义

Question

我有一组对象。可以向阵列添加新对象，但是会发生一些奇怪的事情。一旦添加了新对象，它将无法通过我的Object.keys(widgetInfo.main).length > 0检查。近距离观察，我观察到以下内容：

似乎一旦创建了新对象，它仍然会推送数据，但是控制台将数据显示在空括号中。仅新的窗口小部件显示此行为。其他小部件类似于图片的第二部分。重新加载页面后，新的小部件将显示应有的对象，其ID位于方括号之间。那么Object.keys(widgetInfo.main).length > 0将具有值，并且代码将按预期工作。图片的最后一部分显示了console.log之前的所有组件。如您所见，新对象似乎显示出与旧对象完全相同的行为。

代码：

      {Object.entries(widgetData).map(widget => {
        //widgetdata is the array of objects
        console.log('widget trigger', widgetData);
        return (
            <CardContent scrollbar={false}>
              {createComponent(widget[1], widget[0])}
            </CardContent>
        );
      })}

      //create compontent function
      const createComponent = (widgetInfo, widgetId) => {
        return (
        //object keys check that will fail for new oject
        Object.keys(widgetInfo.main).length > 0 && (
        <Grid>...

什么会导致将数据显示在方括号中的问题？我可以提供更多。

Answer 1

您确定widgetInfo.main返回一个对象吗？我会检查的。