Question

我有一个反应组件，我改变了html体类。该类正在componentDidMount中添加，并在componentWillUnmount中删除。我正在使用Flow进行类型检查。当我运行Flow时出现以下错误：

src/modules/homepage/HomePage.js:27
 27:         document.body.classList.remove('homepage')
                           ^^^^^^^^^ property `classList`. Property cannot be accessed on possibly null value
 27:         document.body.classList.remove('homepage')
             ^^^^^^^^^^^^^ null

有人可以建议如何抑制此错误或推荐的方法是什么？

谢谢

Answer 1

这个错误正是它听起来的样子。无法在可能为null的值上访问属性classList。（document.body）

直到document.readyState is interactive才定义

document.body。您可以同样等待domcontentready或load个事件，但由于您正在渲染React组件，因此您可能已经这样做了。

实际上，流程在这里很烦人，因为在浏览器环境中定义了document.body后，它就会保持定义。

以下是一些简单的解决方案：

您可以使用invariant功能：不变（document.body的）; //如果document.body不存在则抛出错误 document.body.classList.remove（＆＃39;主页＆＃39）;

或者将语句放在if块中：

if (document.body) {
    document.body.classList.remove('homepage') 
}

Answer 2

使用过：

document.body !== null && document.body.classList.remove('homepage');

似乎为我解决了流量错误。

React Flow可能与document.body.classList.add一起使用null值

2 个答案: