Reactjs setEmail 不是函数 onChange 虽然它是函数答案

【问题标题】：Reactjs setEmail is not a function onChange although it is functionReactjs setEmail 不是函数 onChange 虽然它是函数
【发布时间】：2021-07-17 11:12:17
【问题描述】：

它给出了一个错误，我不知道为什么，如果你看我的代码，你会看到没有任何问题。登录路由页面：

    const [email, setEmail] = useState("");
    
    <LoginPage
              email={email}
              setEmail={setEmail} />

登录表单代码：

    const {
        email,
        setEmail,
      } = props;
    
    <input
                    type="email"
                    className="form-control"
                    placeholder="Enter email"
                    value={email}
                    onChange={(e) => setEmail(e.target.value)}
                  />

【问题讨论】：

尝试使用 const [email, setEmail] = useState('') 在同一组件中本地设置它，如果可行，那么至少您知道它是导致问题的父级。
什么意思？我需要携带这个道具，因为有很多道具，如用户名密码等。我只要求1个道具，但其他人也有同样的问题
您的代码不可编译。
那我该怎么办@xehpuk
@efesahin 发布一个完整的例子。

标签： reactjs firebase authentication react-props

【解决方案1】：

登录页面组件 <LoginPage />

登录表单组件

import React, { useState } from "react";

const LoginForm = (props) => {
  const [email, setEmail] = useState("");
  return (
    <>
      <input
        type="email"
        className="form-control"
        placeholder="Enter email"
        value={email}
        onChange={(e) => setEmail(e.target.value)}
      />
      {/* Other components */}
    </>
  );
};

【讨论】：

为什么？ loginpage 组件不应该有道具吗？
当然，我们只是在这个实例中测试子组件，类似于单元测试。试一试，看看你是否得到预期的结果，然后我们可以看看父组件。