Question

错误说 TypeError:无法读取未定义的属性“getElementById”

2020-12-22

353

javascript css reactjs

import React, { document } from "react";
import "./LoginandRegister.css";

function LoginandRegister() {
  const signUpButton = document.getElementById("signUp");
  const signInButton = document.getElementById("signIn");
  const container = document.getElementById("container");

  signUpButton.addEventListener("click", () =>
    container.classList.add("right-panel-active")
  );
  signInButton.addEventListener("click", () =>
    container.classList.remove("right-panel-active")
  );

Answer 1

在 React 中，有很多方法可以处理按钮交互，但使用 getElementById 并附加事件侦听器并不被视为正常/良好做法。您还应确保向 className 属性提供所有 css 类，而不是使用 classList.add(...) ，假设 signUp 、 signIn 和 container 均被呈现为 React 组件或 JSX。

查看在 React 中处理事件，获取有关如何处理按钮点击的一些灵感。

此外，从 react 包导入 document 会覆盖您可以用来附加事件侦听器的默认文档对象。所以我猜如果你删除导入，它就会起作用，所以它只是说 import React from 'react' 。不过我认为这仍然不是一个合适的解决方案，你一定要看看 React 文档。