为什么Object.keys（this.refs）不返回所有键？

Question

嗨， 因此我从屏幕截图中删除了一些敏感信息，但您可以看到足够多的内容来了解​​我的问题。

现在，我正在尝试为从气象站获取数据的站点构建UI。 我正在尝试使用react-google-maps的InfoBox，默认情况下会禁用鼠标事件。 似乎要启用鼠标事件，必须等待DOM加载完毕，然后添加事件处理程序。

react-google-maps的InfoBox会触发onDomReady事件（甚至在添加更多div时），但似乎永远不会触发onContentChanged事件（我在node_modules代码中已经看到）。 / p>

我要在InfoBox中放入的内容基本上是div，其中每种天气数据的类型都是string ref。有时会出现一种新型的天气数据，因此我也想输入这些数据，并让ref可用/可用。

但是，在添加新的div（并已更新DOM以显示它们）之后，当我尝试控制台记录DOM节点时（ref指的是节点，因为它们是div而不是自定义的组件），因此最新添加的未定义。 稍后它们会变成div（而不是undefined）一些渲染。

我认为这可能是因为
1）DOM在我尝试访问ref之前没有更新，
但是确实UI显示了新的div，
2）不推荐使用string ref（反应16.5），
但它们适用于div中的comonentDidMount，最终适用于div中的新componentDidUpdate，
3）在return的{​​{1}}值内执行代码可能与render异步运行，
但是我也尝试了componentDidMount并用3000毫秒来达到相同的效果，
4）与可枚举属性有关，
但是setTimeout的行为方式相同。

最后，我决定在相同的几行代码中显示控制台日志getOwnProperties和this.refs（如屏幕快照所示），您可以在一个控制台日志语句中看到该日志（在上一行使用Object.keys(this.refs)的情况下），尽管Object.keys是具有8个键的对象，但是最近添加的两个this.refs不会出现在ref中。 / p>

这可能是react-google-maps的InfoBox，React的Object.keys(this.refs)和JavaScript的ref之间的超级复杂的交互，但是似乎它应该很简单，使我迷惑不解。
谁能阐明为什么会这样？

代码看起来相似：

Object.keys

从本质上讲，这是组件。