时间戳

首页 > 解决方案 > useState 中的函数错误为不是函数

reactjs - useState 中的函数错误为不是函数

问题描述

我正在尝试使用反应钩子，但我必须遗漏一些东西。我没有得到以下任何设置功能的功能。

以此作为参考：https ://reactjs.org/docs/hooks-state.html

function Login() {
  const [user, pass, setUser, setPass, test, setTest] = useState();

  return (
    <LoginWrapper>
      <Branding brand={brand.brandName} />
      <FormWrapper>
        <Stack>
          <TextInput
            type="text"
            label="Username"
            onChange={() => setUser(this)}
          />
        </Stack>
        <Stack>
          <TextInput
            type="password"
            label="Password"
            onChange={() => setPass(this)}
          />
        </Stack>
        <Stack padding="0" align="right">
          <Button
            onClick={() => {
              setTest("user and pass");
            }}
          >
            Login
          </Button>
        </Stack>
      </FormWrapper>
    </LoginWrapper>
  );
}

标签： reactjsreact-hooks

解决方案

通过使用useState，您将获得一个数组，其中第一个元素是初始状态，第二个元素是状态的设置器。

你pass实际上是user.

要像您想要的那样使用多个值，您必须执行以下操作：

const [user, setUser] = useState(...);
const [pass, setPass] = useState(...);
const [test, setTest] = useState(...);

或者作为替代方案，您可以将其用作具有单个 的组合对象useState，但您必须将其与当前状态合并。

推荐阅读