时间戳

首页 > 解决方案 > 我想在 React 中显示 Snack Bar

javascript - 我想在 React 中显示 Snack Bar

问题描述

这是单击按钮时调用的函数。

handleClick() {
        var x = document.getElementById("snackbar");
        x.className = "show";
        setTimeout(function () {
            x.className = x
                .className
                .replace("show", "");
        }, 3000);
        return (
            <div id="snackbar">DONE</div>
        )
    }

这是我的点击onClick={this.handleClick}

它向我显示了一个错误“未捕获（承诺）TypeError：无法设置属性'className' of null”我做错了什么。感谢所有帮助。

标签： javascriptreactjs

解决方案

TypeError：无法将属性“className”设置为空”

意味着您正在尝试访问空变量中的类名属性。

如果var x = document.getElementById("snackbar");没有结果，则返回null，x等于null。之后添加 console.log(x)var x = document.getElementById("snackbar");以便您可以测试它是否来自这里。

它可能是由以下原因引起的：

Invalid HTML syntax (some tag is not closed or similar error)
Duplicate IDs - there are two HTML DOM elements with the same ID
Maybe element you are trying to get by ID is created dynamically (loaded by ajax or created by script)?

推荐阅读