如何在组件类中使用调度(react-redux)

2024-01-14

My code

class LoginPage extends Component {

  render() {
    return (
        <div>
          <TextInput/>
          <br/>
          <TextInput/>
          <br/>
          <Button onClick={() => {
            const dispatcher = useDispatch();
            dispatcher(singIn())
          }}>SING IN</Button>
        </div>
    );
  }
}

我想我在类组件中使用了钩子,但是我可以用什么来代替useDispacth到我的登录页面?


对于类组件,您需要使用connect方法来自react-redux。使用 connect 方法并传递mapDispatchToProps功能如下图。

import { connect } from 'react-redux';
class LoginPage extends Component {

    render() {
        return (
            <div>
                <TextInput/>
                <br/>
                <TextInput/>
                <br/>
                <Button onClick={() => {
                    this.props.singIn()
                }}>SING IN</Button>
            </div>
        );
    }
}



const mapDispatchToProps = (dispatch) => {
    return {
        signIn: () => dispatch(signIn())
    }
};
export default connect(null, mapDispatchToProps)(LoginPage)

阅读文档以获取更多信息。https://react-redux.js.org/api/connect https://react-redux.js.org/api/connect

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

如何在组件类中使用调度(react-redux) 的相关文章

  • 了解设置 JQuery 变量

    了解设置 JQuery 变量 最近 我通过在 StackOverflow 上遇到的另一个问题寻找帮助 了解到如何设置 JQuery 变量 如下所示 您可以通过简单地调用变量来创建输入字段 并且锚变量似乎也定义了样式 var clicked
  • 从数据 URI 解码 QR 码

    我尝试从数据 uri 中解码二维码 var dataUri data image gif base64 R0lGODdh9gD2AIAAAAAAAP ywAAAAA9gD2AAAC decodeQrCode dataUri cb 我已经尝试
  • Web 串行 API - 未捕获(承诺中)DOMException:无法打开串行端口/所需成员 baudRate 未定义

    下面的代码可以在我的 Xubuntu 机器上运行 但现在我在 Kubuntu 上 它不再工作了 它不会打开端口 Arduino IDE 工作正常 可以向开发板写入代码 并且我可以在 Chrome 中选择设备 Arduino Uno 但当我尝
  • 解析“流”JSON

    我在浏览器中有一个网格 我想通过 JSON 将数据行发送到网格 但浏览器应该在接收到 JSON 时不断解析它 并在解析时将行添加到网格中 换句话说 在接收到整个 JSON 对象后 不应将行全部添加到网格中 应该在接收到行时将其添加到网格中
  • 如何重置使用 JavaScript 更改的 CSS 属性?

    我的导航按钮的宽度从 100px 增加到 150px 当鼠标悬停在 nav li hover width 150px 但是使用 javascript 我已经做到了 无论选择哪个选项 宽度都将继续为 150px 当选择每个选项时 它会使其他选
  • 使用模数按字母顺序对列表进行排序

    我在获取元素列表并按字母顺序对它们进行排序方面没有任何问题 但我很难理解如何使用模数来做到这一点 更新 这是按我的方式工作的代码 但是 我更喜欢下面提供的答案的可重用性 因此接受了该答案
  • jQuery AJAX 调用 Java 方法

    使用 jQuery AJAX 我们可以调用特定的 JAVA 方法 例如从 Action 类 该 Java 方法返回的数据将用于填充一些 HTML 代码 请告诉我是否可以使用 jQuery 轻松完成此操作 就像在 DWR 中一样 此外 对于
  • 使用 Angular 下载具有动态 src 的脚本

    Angular 提供了通过动态名称动态加载模板的方法ng include 该部分中的内联 JS 和 CSS 可以正常加载 但没有一个好的方法来下载带有动态 url 的脚本 我们需要下载脚本 相对于调用它们的 html 部分的路径 即我们有一
  • Google App Engine:修改云运行环境

    我正在尝试部署一个使用自定义 Node js 服务器的 Next js 应用程序 我想将自定义构建变量注入应用程序 next config js const NODE ENV process env NODE ENV const envTy
  • 如何监听 jQuery AJAX 请求?

    以下两种实现 ajaxRequest 1 2 的方法应该是等效的 话说回来 为什么验证回调已执行的单元测试 3 在 1 中成功而在 2 中失败 我应该如何重写测试 3 来监视 2 中的成功回调 如果我尝试stub jQuery ajax使用
  • 使用 KnockoutJs 映射插件进行递归模板化

    我正在尝试使用以下方法在树上进行递归模板化ko映射 插入 http knockoutjs com documentation plugins mapping html 但我无法渲染它 除非我定义separate每个级别的模板 在以下情况下
  • React - 无法读取未定义的属性[重复]

    这个问题在这里已经有答案了 通常 当我单击子组件中的菜单项时 它会调用 this handlesort 这是一个本地函数 处理排序从我的父组件中获取 onReorder 属性 onReorder 调用名为 reOrder 的本地函数 它设置
  • 在 webpack 2.x 中使用 autoprefixer 和 postcss

    如何使用autoprefixer使用 webpack 2 x 以前 它曾经是这样的 module loaders test scss loader style css sass postcss postcss gt return autop
  • HTML 离线应用程序缓存,列出下载的文件

    作为我正在构建的离线 Web 应用程序的加载屏幕的一部分 使用缓存清单 http developer apple com library safari documentation iPhone Conceptual SafariJSData
  • 有没有办法阻止 prettier / prettier-now 将函数参数分解为新行

    当使用 prettier prettier now 在保存时进行格式化时 当一个函数包装另一个函数时 它会中断到一个新行 我想知道是否有办法阻止这种行为 例如 期望的输出 app get campgrounds id catchAsync
  • 在 vue.js 中访问数组对象属性

    给定以下数组vue js packageMaps Object packageMap 0 Object Id 16 PackageType flag list ProductCode F BannerBase packageMap 1 Ob
  • 如何更改此 jquery 插件的时区/时间戳?

    我正在使用这个名为 timeago 的插件 在这里找到 timeago yarp com 它工作得很好 只是它在似乎不同的时区运行 我住在美国东部 费城时区 当我将准确的 EST 时间放入 timeago 插件时 比如 2011 05 28
  • 问题:为什么React Native Video不能全屏播放视频?

    我正在react native 0 57 7 中为android和ios创建一个应用程序并使用反应本机视频 https github com react native community react native video播放上传到的视频
  • 将 MQTTNet 服务器与 MQTT.js 客户端结合使用

    我已经启动了一个 MQTT 服务器 就像this https github com chkr1011 MQTTnet tree master例子 该代码托管在 ASP Net Core 2 0 应用程序中 但我尝试过控制台应用程序 但没有成
  • 如何获取浏览器视口中当前显示的内容

    如何获取当前正在显示长文档的哪一部分的指示 例如 如果我的 html 包含 1 000 行 1 2 3 9991000 并且用户位于显示第 500 行的中间附近 那么我想得到 500 n501 n502 或类似的内容 显然 大多数场景都会比

随机推荐

  • R 中的堆叠条形图再现

    我试图在 R 中重现该图 但没有成功 但更多的岁月里 这是数据 title 2016 phased 2017 phased 2018 phased 2019 fully loaded Pillar 1 minimum requirement
  • hive 查询的简单 oozie 示例?

    我正在尝试将一个简单的工作流程转换为 oozie 我尝试过查看 oozie 的示例 但它们有点令人难以接受 实际上 我想运行查询并将结果输出到文本文件 hive e select from tables gt output txt 我如何将
  • React Native 横向模式仅适用于一页

    在 React Native 中是否可以让应用程序以纵向模式运行 但让一个页面以横向模式运行 我知道在 Xcode 中你必须一开始就选择纵向或横向 所以我对如何使应用程序中除一个页面之外的所有页面都变成纵向有点困惑 在 React Navi
  • 如何让用户输入两次以上?

    我是 C 新手 我试图了解如何利用 C 通用输入 cin 我正在尝试编写一个程序来检查句子的字符数量和输入句子中的元音数量 我已经成功完成了这一任务 但是当我尝试让代码再次运行一次时 出现了问题 当它再运行一次时 就不再允许第二次输入 我的
  • Python 中的静态方法和实例方法[重复]

    这个问题在这里已经有答案了 我可以将 Python 方法同时定义为静态方法和实例方法吗 就像是 class C object staticmethod def a self arg1 if self blah blah 这样我就可以同时调用
  • 记录 WCF 接口的最佳方式? [关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 因此 我正在使用 WCF 并且想要记录我的接口和服务 以便提供给另一家公司的内部应用程序 记录这些接口的最佳方法是什么 我更喜欢将文档与代码内联
  • Android 中的圆形按钮

    我想在 Android 程序中创建圆形按钮 我看过如何创建圆角的EditText https stackoverflow com questions 3646415 how to create edittext with rounded c
  • 在 Matplotlib 的条形图上显示负值的问题

    我正在尝试使用 Matplotlib 创建一个包含正值和负值的条形图 但在让负值显示在 Y 轴上时遇到困难 运行代码时 它将正确显示所有正值 以红色标记 但根本不显示负值 相反 我得到了标记为 y1 的字符串的正值的重复项 请参阅下面的图片
  • 如果每行包含不同数量的字段(数量很大),如何正确读取csv文件?

    我有一个来自亚马逊的文本文件 包含以下信息 user item time rating review text the header is added by me for explanation not in the text file d
  • 如何创建频道然后找到ID

    我正在创建一个频道message guild channels create 我该如何找到该频道的消息 ID 并在新创建的频道中发送消息 message guild channels create bug priority reportPr
  • JS中获取未知单键的对象的值

    如何获取具有未知单键的对象的值 例子 var obj dbm 45 我想在不知道其密钥的情况下获得 45 值 我知道我可以循环对象键 始终是一个 for var key in objects var value objects key 但我
  • 实现登录(身份验证)屏幕的最佳实践是什么?

    我想在我的应用程序中实现登录屏幕并寻找最佳实践 假设这段代码 public class LoginActivity extends Activity public void onCreate Bundle icicle super onCr
  • Restful Api Express postgres 数据库

    我正在使用node和express开发一个restful api 我的数据库是postgresql 我需要使用postgres包pg promise 我知道我需要将我的应用程序与 app js 文件中的数据库连接 但我的问题是 我应该如何在
  • iPhone 4" 屏幕上的 xcassets 无法提取正确的图像

    我正在尝试将 Images xcassets 实现到我正在开发的项目中 据我了解 我可以将不同设备的所有不同大小的图像放在那里 然后调用 UIImage imageNamed name of image set 它将返回我正在处理的设备的正
  • Access 和 SQL Server 计算日期的方式不同

    我们有一些通用工具 除其他外 可以保存和显示日期 它将把它保存为一个数字 例如 41247 如果我将其转换回 Access 中的日期 我会得到 2012 12 04 这是正确的 使用 Format 41247 常规日期 或 Format F
  • 将 XML jQuery 对象转换为字符串

    我有一个上传的 xml 文件 我正在使用 jQuery 通过var ts parseXML filecontents 在 XML 文档中查找对象时 我尝试使用以下方法转换回原始源 div append ts find Object clon
  • “新运营商”和“新运营商”之间的区别?

    新运营商 和 新运营商 有什么区别 我通常会尝试用不同的措辞来更好地区分两者 但无论如何 这是一个好问题 Operator new 是一个分配原始内存的函数 至少在概念上 它与malloc 尽管这相当不寻常 除非您正在编写类似自己的容器的东
  • 如何修复无法转换类型错误?

    我想创建一个有关电影的详细信息页面 但我收到此错误并且有点卡住了 我收到无法转换类型错误 我确实理解该错误 但我不知道如何修复它 这是 PAP 实体的索引 也是数据库实例 public class MoviesController Cont
  • NSToolbarItem 的自动样式/着色

    有没有办法告诉 OS X 自动设置样式 着色NSToolbarItem 我通过 IB Xcode 添加了一个 图像工具栏项 并将图标设置为黑色 PDF如文档中所述 https developer apple com library mac
  • 如何在组件类中使用调度(react-redux)

    My code class LoginPage extends Component render return div div