React 16.7 Hooks:`react.useState` 不是一个函数

2024-02-05

我正在尝试带有react 16.7的钩子的功能组件,出现错误:

src/组件/页脚/index.js

function Footer() {
  const [selectedTab, setSelectedTab] = useState('redTab');
  const [hidden, setHidden] = useState(false);
  const [fullScreen, setFullScreen] = useState(false);
 //...
}

包.json

我应该怎么办?


确保您已升级react-dom to 16.7.0-alpha.0以及。

包.json

{
  "dependencies": {
    "react": "16.7.0-alpha.0",
    "react-dom" :"16.7.0-alpha.0",
    ...
  },
  ...
}

也可能是您只更新了版本package.json无需安装新版本。您可以删除node_modules并再次安装 https://docs.npmjs.com/cli/ci.

npm ci

Example

const { useState } = React;

function Footer() {
  const [selectedTab, setSelectedTab] = useState('redTab');
  const [hidden, setHidden] = useState(false);
  const [fullScreen, setFullScreen] = useState(false);
  
  return (
    <div>
      <button onClick={() => setSelectedTab('blueTab')}>{selectedTab}</button>
      <button onClick={() => setHidden(isHidden => !isHidden)}>
        {hidden ? 'hidden' : 'visible'}
      </button>
      <button onClick={() => setFullScreen(isFullScreen => !isFullScreen)}>
        {fullScreen ? 'fullscreen' : 'windowed'}
      </button>
    </div>
  );
}

ReactDOM.render(
  <Footer />,
  document.getElementById('root')
);
<script src="https://unpkg.com/[email protected] /cdn-cgi/l/email-protection/umd/react.development.js"></script>
<script src="https://unpkg.com/[email protected] /cdn-cgi/l/email-protection/umd/react-dom.development.js"></script>

<div id="root"></div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

React 16.7 Hooks:`react.useState` 不是一个函数 的相关文章

随机推荐

  • 在python中将二进制整数写入文件

    如何在 Python 3 中将整数写入二进制文件 例如 我想将 6277101735386680763835789423176059013767194773182842284081 以恰好 24 个字节的二进制格式写入文件 无符号 我只会使
  • 如果调用 fclose(0),这会关闭标准输入吗?

    如果调用 fclose 0 这会关闭标准输入吗 我问这个问题的原因是由于某种原因 stdin 在我的应用程序中被关闭 我不明白为什么 我检查了 fclose stdin 但这不在应用程序中 所以我想知道 fclose 0 是否会导致未定义的
  • 仍然对 Objective-C 的动态绑定感到困惑

    这个问题来自我刚刚添加到答案中的评论这个问题 https stackoverflow com questions 6608551 question about dynamic binding objective c and methods
  • 看起来我正在实例化这个 SpeechAPI 接口。这怎么可能?

    我在我的项目中使用 Microsoft 文本到文本语音功能 但我对此有一个问题 实际上不是直接的问题 所以 通常程序员在创建接口时 他们会将 I 作为接口名称的前缀 如 IReadable IEnumerator 等 但我遇到过一些让我震惊
  • Unity 2D:区域颜色反转效果

    我正在尝试创建一个 GameObejct 如果处于活动状态 则会反转其后面任何内容的颜色 理想情况下 当该游戏对象出现 变为活动状态时 它会从其中心点扩展到一定大小的半径 因此 想象一个圆 其比例在 1 或 2 秒内逐渐从 x 0 和 y
  • 如何排除模板文字类型的子字符串?

    我想从模板文字类型 自 TypeScript 4 1 起可用 中排除一些子字符串 但我不知道是否可能 Example 我可以定义一个类型说 这个字符串是一个包含 2 个或更多元素的元组 即类似的东西 string number 使用这个文字
  • Symfony 2 - 在 ROLE_USER 下添加用户角色

    我正在尝试在 Symfony 2 中的默认 USER ROLE 下创建一个新角色 该角色对某些功能的写访问权限有限 我正在使用 FOSUserBundle 到目前为止 我已经编写了以下安全设置 但我的 ROLE DEMO 用户仍然获得 RO
  • Rails 时区问题

    这是我的控制台 irb main 048 0 gt Time now gt 2011 04 13 00 51 50 0200
  • Python ctypes 和动态链接

    我正在用 C 编写一些库 其中包含我想通过 ctypes 从 Python 调用的函数 我已经在另一个库中成功完成了此操作 但是该库只有非常普通的依赖项 即fstream math malloc stdio stdlib 我正在开发的另一个
  • 如何要求 XSD.exe 为我生成正确的类,以便我可以创建良好的 XML

    我从 Visual Studio 2010 创建了一个 XSD 文件 然后我用xsd c mydemo xsd为我生成类 以便我可以在运行时创建 XML 文件 但是 当我使用该类 填充一些值并序列化该对象时 XML 文件对我来说看起来不太好
  • 如何以最少的时间损失,根据数组中指定的字母表对一个大数组进行排序?

    如何以最少的时间浪费有效地按数组中指定的字母对具有百万个值的数组进行排序 letters array 按特定键对数组进行排序的简单函数 维护索引关联 该函数还对数组进行排序 但不是按我的字母表排序 而是按英文字母表排序 在英文字母中效果更好
  • 如何在 Mac 上安装 python3.4-dev?

    我已经尝试过 pip 和 homebrew pip search python3 4 dev并且brew search python并且在其中任何一个中都找不到 python3 4 dev 有任何想法吗 Pip 本身不会安装 Python
  • 使用 GDK 启动应用程序时嵌套多个语音触发器的方法

    使用 GDK 在 Google Glass 上启动应用程序时 是否可以嵌套语音触发器 例如 不要只是说 好吧 玻璃 gt 它的功率水平是多少 我想让应用程序提供一个选项 例如 好的 玻璃 gt 它的功率是多少 gt 超过 9000 或 低于
  • Rails 3.1 资产管道供应商/资产文件夹组织

    我正在使用jQuery 工具 http flowplayer org tools 我的 Rails 3 1 站点中的可滚动库 各种资源放置在供应商 资产文件夹中 效果很好 我的问题是关于组织供应商 资产下的各种文件的最佳方式 组织供应商 资
  • 为什么我的 PHP 电子邮件表单会吸引垃圾邮件?

    我建立了一个网站 我想在网页上有一个电子邮件联系表 以便有人可以向我发送消息 我正在使用该网站的代码 http www w3schools com php php secure mail asp http www w3schools com
  • 如何使 Google Drive Java SDK 读取/写入“我的云端硬盘”而不是其他地方?

    我正在使用最新的 Google Drive Java SDK 1 9 0 rev 155 并且我已经成功地使其能够上传文件 列出文件 创建目录 这非常困难 以及其他各种操作 但是我上传的内容在Web界面中是不可见的 同样Web界面中的内容对
  • 函数存储在变量中? JavaScript

    有人可以解释一下 JavaScript 中的这个表示法吗 函数 d 在做什么 在这个程序中 x 似乎是由以下调用的 但我不知道这意味着什么 提前致谢 x function d return d x width mx later x x 9
  • 查看网站是否已关闭的代码? [关闭]

    很难说出这里问的是什么 这个问题是含糊的 模糊的 不完整的 过于宽泛的或修辞性的 无法以目前的形式得到合理的回答 如需帮助澄清此问题以便重新打开 访问帮助中心 help reopen questions 我正在尝试复制类似的网站http w
  • JNA鼠标钩子的工作示例

    谁能给我提供一个 JNA 鼠标钩子的工作示例 它能够在我的 Java Swing 应用程序之外跟踪鼠标移动 单击 提前致谢 是的 这是代码 public class CWMouseHook public final User32 USER3
  • React 16.7 Hooks:`react.useState` 不是一个函数

    我正在尝试带有react 16 7的钩子的功能组件 出现错误 src 组件 页脚 index js function Footer const selectedTab setSelectedTab useState redTab const