javascript - 如何在 React.JS 中通过 className 使元素消失？

Question

我正在尝试在 React 中制作一个主题选择器。但是当我使用

document.getElementsByClassName[0].style.setProperty("display", "none");

为了让元素消失，它会返回

类型错误:无法读取未定义的属性“setProperty”。

有没有办法修复此错误或有其他方法使元素消失？提前致谢。

Answer 1

当您尝试获取 getElementsByClassName 的元素时您需要将类名作为参数传递，如下所示

document.getElementsByClassName('test')

然后，您可以尝试:

document.getElementsByClassName('test')[0].style.setProperty("display", "none")

稍微剪一下:

button.addEventListener("click", () => {
  document
    .getElementsByClassName("test")[0]
    .style.setProperty("display", "none");
});

<div class="test">element</div>
<button id="button">Hide it</button>