首页 > 其他分享 >Redux的使用(一)

Redux的使用(一)

时间:2024-01-25 16:23:07浏览次数:32  
标签:return preState data 使用 Redux type store

Redux的使用

  • store 文件如下

    import { createStore } from 'redux'
    export const store = createStore((preState = 0, { type, data }) => {
        switch (type) {
            case 'add':
                return preState + data
            case 'jian':
                return preState - data
            default:
                return preState
        }
    })
    
  • 那么如何触发 store 呢?代码如下

    store.dispatch({ type: 'add', data: 1 })
    
  • 页面渲染

    <h1>{store.getState()}</h1>
    
  • 最后还需在入口文件中加入如下代码,才能实现响应式

    store.subscribe(() => {
        root.render(
            <App />
        );
    })
    

标签:return,preState,data,使用,Redux,type,store
From: https://www.cnblogs.com/zhumenglong/p/17987410

相关文章

  • JAVA学习笔记--使用Inte IDEA
    使用IntellijIDEA编写代码新建项目创建新项目选择创建一个空项目并输入项目名弹出ProjecStructure窗口先关闭新建一个模板(Module)并输入模板名打开前面关闭的ProjecStructure窗口修改以下信息(注意:安装的是JDK8则按照以下信息修改,若安装的是JDK其他版本则......
  • 源码文件阅读---hooks的使用---使用文心一言读代码
    import{CommonFormTypes}from'globalConstants';import{createContext,useCallback,useState}from'react';import{BoardType}from'../../../DashBoardPage/pages/Board/slice/types';import{VizType}from'./slic......
  • [转]vs2019升级后,启动调试,谷歌浏览器无法正常使用 - 温故纳新 - 博客园
    解决方法:vs2019按如下步骤设置:工具  =》 选项  =》调试 =》 常规 =》勾选“启用APS.NET 的 Javascript 调试(Chrome和IE)”---------------------作者:温故纳新来源:CNBLOGS原文:https://www.cnblogs.com/tomorrow0/p/14383870.html版权声明:本文为作者原创文章,转载请......
  • Postman使用总结
    对于黑盒测试工程师来说,使用postman的场景无非就是拿它看看接口返回的数据。比对一下预期返回的参数与实际是否相符。所以我这里的postman使用方法仅限于如何调用接口。 首先,你需要下载postman(毋庸置疑,其实用网页版也可以)官网主页:https://www.postman.com/downloads/安装你......
  • 【技术探讨】用户使用其他厂家433MHz无线模块时,购买样品OK,小批量100个就会出现偶尔无
        许多用户使用其他厂家的433M透传无线模块反馈这样的问题:前期购买几个样品测试,在无线信号覆盖半径内,收发包测试都很稳定,但是小批量购买100个模块收发就会出现无法收发的情况。这是什么原因呢?    首先科普一下,无线电波,在同一个信道同一时刻只允许一个节点发射行......
  • de4dot 使用
    1#直接解混淆,一般效果还行,结果文件命名为"file1-cleaned"2de4dot.exefile13#可以一次处理多个文件4de4dot.exefile1file2file35#递归搜索.NET文件,处理后输出到output文件夹,-r表示recursively6de4dot.exe-rc:\my\files-roc:\my\output7#-f指定输......
  • jclasslib 插件安装及使用
    原文地址blog.csdn.net学习Java,必须要了解JVM,而学习JVM知识时,总要去研究一些字节码指令而jclasslib这个插件很好的解决了这个问题jclasslib安装:1.打开设置或者按Ctrl+Alt+S,打开设置2.找到jclasslib插件点击install下载安装即可3.安装完重启,然后点击视图:......
  • 前端工程化解决方案webpack使用小结
    前端工程化解决方案webpack,模块化、组件化、规范化、自动化,使得前端开发更加高效。功能:代码压缩混淆、处理浏览器端js的兼容性、以模块化的方式处理项目中的资源webpack插件:clean-webpack-plugin清除dist文件夹之前打包生成的文件使用步骤:先安装 再在webpac......
  • K8s笔记-使用 Service 把前端连接到后端
    1配置configMap1.1配置cm[root@k8s-master~]#kubectlexec-itnginx-deploy-78d8bf4fd7-2xtd2-ntest--sh-c"cat/etc/nginx/nginx.conf"[root@k8s-master~]#kubectlexec-itnginx-deploy-78d8bf4fd7-2xtd2-ntest--sh-c"cat/usr/share/ngi......
  • 使用Java中的OkHttp库进行HTTP通信:快速、简单且高效
    在Java的世界里,进行HTTP通信的方式多种多样。其中,OkHttp以其简单、高效和强大的功能受到了开发者的广泛欢迎。今天,我们就来深入探讨如何使用OkHttp库在Java中进行HTTP通信。首先,OkHttp是一个基于HTTP/2和SPDY的客户端,提供了现代且高效的通信方式。它不仅支持同步请求和异步请求,还提......