react学习-redux快速体验

大兵的猫

于 2024-06-15 16:16:46 发布

阅读量349

点赞数 3

CC 4.0 BY-SA版权

分类专栏： React JavaScript 文章标签： react.js 学习 javascript

本文链接：https://blog.youkuaiyun.com/Error_ABC/article/details/139703502

1.redux是用于和react搭配使用的状态管理工具，类似于vue的vuex。redux可以不和任何框架绑定，独立使用
2.使用步骤
（1）定义一个reducer函数（根据当前想要做的修改返回一个新的状态）
（2）使用createStore方法传入erducer函数生成一个store实例对象
（3）使用store实例的subscribe方法订阅数据变化（数据一旦变化可以得到通知）
（4）使用store实例的dispatch方法提交action对象触发数据变化（告诉reducer你想要怎么改数据）
（5）使用store实例的getState方法获取最新的状态数据更新到视图中
3.代码案例

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <button id="decrement">-</button>
    <span id="count">0</span>
    <button id="increment">+</button>

    <script src=