小程序中状态管理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: "张三" } });
相关推荐
说私域26 分钟前
“开源链动2+1模式AI智能名片S2B2C商城小程序”在拉群营销中的应用与效果
人工智能·小程序
2501_915106321 小时前
App 怎么上架 iOS?从准备资料到开心上架(Appuploader)免 Mac 上传的完整实战流程指南
android·macos·ios·小程序·uni-app·iphone·webview
环信即时通讯云3 小时前
实现小程序 uniApp 输入框展示自定义表情包
小程序·uni-app
2501_915921435 小时前
iOS 抓不到包怎么办?工程化排查与替代抓包方案(抓包/HTTPS/Charles代理/tcpdump)
android·ios·小程序·https·uni-app·iphone·tcpdump
JSON_L7 小时前
Fastadmin中使用小程序登录
小程序·php·fastadmin
星光一影8 小时前
悬赏任务平台/拉新地推系统源码
redis·mysql·小程序·php·uniapp·html5
2501_915918418 小时前
Fiddler抓包工具详解,HTTP/HTTPS抓包、代理设置与调试技巧一站式教程(含实战案例)
http·ios·小程序·https·fiddler·uni-app·webview
一匹电信狗9 小时前
【C++】哈希表详解(开放定址法+哈希桶)
服务器·c++·leetcode·小程序·stl·哈希算法·散列表
2501_9159090612 小时前
iOS 发布 App 全流程指南,从签名打包到开心上架(Appuploader)跨平台免 Mac 上传实战
android·macos·ios·小程序·uni-app·cocoa·iphone
zy happy1 天前
RuoyiApp 在vuex,state存储nickname vue2
前端·javascript·小程序·uni-app·vue·ruoyi