小程序中状态管理Redux

Redux 是一个 集中式 状态管理框架,所有状态存储在一个 全局 Store 中,并通过 Action 触发 Reducer 进行数据更新。。

1.安装

javascript 复制代码
npm install redux miniprogram-computed

2.创建

javascript 复制代码
// store.js
import { createStore } from "redux";

// 定义初始状态
const initialState = {
  userInfo: null
};

// 定义 Reducer
function reducer(state = initialState, action) {
  switch (action.type) {
    case "SET_USER":
      return { ...state, userInfo: action.payload };
    default:
      return state;
  }
}

// 创建 Store
export const store = createStore(reducer);

3.使用

javascript 复制代码
// page.js
import { store } from "../../store";

// 获取全局状态
console.log(store.getState().userInfo);

// 更新全局状态
store.dispatch({ type: "SET_USER", payload: { name: "张三" } });
相关推荐
派小心.3 小时前
小程序分享链路中来源参数的传递校验
大数据·前端·数据库·人工智能·小程序·数据分析
一木 之林6 小时前
微信小程序开发全攻略·文章版|00 总览:74集学习路径与知识地图
人工智能·学习·计算机视觉·微信小程序·小程序
m0_587383009 小时前
无人自助拼豆系统的全栈开发方案
java·后端·struts·小程序·架构
AI源码9 小时前
雷山苗韵 - 非物质文化遗产传承平台
小程序·非遗小程序
CRMEB系统商城9 小时前
CRMEB开源商城系统(PHP)v8.0,打造全新AI二开商城底座!
开发语言·人工智能·小程序·开源·php
眨眼猫会务智能体12 小时前
眨眼猫会务智能体会务系统的服务响应怎么样?出问题多久有人接?
安全·小程序·会务
微订校园外卖平台12 小时前
校园跑腿小程序上线:四端架构与校园外卖系统履约链路拆解
小程序·架构·外卖系统·本地生活·微订
m0_587383001 天前
广州 24 小时自助健身房解决方案技术实现与实战指南
java·spring·小程序·架构·需求分析
迪飞特科技1 天前
智慧物业平台实战:Spring Boot 整合小程序实现报修巡检费用全流程
spring boot·后端·小程序