Redux更新对象状态
Redux是一个用于管理JavaScript应用程序状态的开源库。它通过一个单一的全局状态树来管理应用程序的状态，并使用纯函数来处理状态的变化。Redux的核心概念包括store、action和reducer。
- Store（存储）：Redux中的store是一个包含应用程序状态的JavaScript对象。它是唯一的，并且是只读的。通过store，我们可以访问和更新应用程序的状态。
- Action（动作）：Action是一个描述状态变化的普通JavaScript对象。它必须包含一个type属性，用于指定要执行的操作类型。除了type属性，action还可以包含其他自定义的数据。
- Reducer（归约器）：Reducer是一个纯函数，它接收当前的状态和一个action作为参数，并返回一个新的状态。Reducer根据action的类型来决定如何更新状态。它应该是一个纯函数，即给定相同的输入，始终返回相同的输出，不产生副作用。
Redux的优势在于它提供了一种可预测的状态管理机制，使得应用程序的状态变化变得可追踪和可调试。它也可以与各种前端框架（如React、Angular、Vue等）结合使用，提供了一种统一的状态管理解决方案。
Redux的应用场景包括但不限于：
- 复杂的应用程序状态管理：当应用程序的状态较为复杂，需要统一管理时，Redux可以提供一种可靠的解决方案。
- 跨组件通信：Redux可以作为一个全局状态管理器，用于在不同组件之间共享数据。
- 时间旅行调试：Redux提供了一种记录和回放状态变化的机制，可以方便地进行调试和排查错误。
腾讯云提供了一些与Redux相关的产品和服务，例如：
- 云原生应用引擎：腾讯云原生应用引擎是一种基于Kubernetes的容器化应用托管服务，可以帮助开发者快速部署和管理Redux应用程序。
- 云数据库Redis版：腾讯云数据库Redis版是一种高性能的内存数据库，可以用于存储Redux应用程序的状态数据。
更多关于腾讯云产品和服务的信息，您可以访问腾讯云官方网站：https://cloud.tencent.com/
相关·内容
2回答
将redux-devtools-extension与react-native配合使用
react-native、redux-devtools-extension
需要帮助为react-native设置Redux扩展我这里有非常简单的reducer和createStore，我试着合并Redux - devTools -devtools，这样我就可以调试我的react-native应用程序了，但是我在Redux标签页上看到"store no found“
import { createStore, applyMiddleware} from 'redux'
import {reducer} from "./reducers"
import { composeWithDevTools, devToolsEnhancer
浏览 13提问于2018-09-01得票数 4
1回答
用createStore取代configureStore
javascript、reactjs、redux、react-redux、next.js
我更新了我的包裹，VScode告诉我createStore被贬值了。所以我开始更换它
我的商店文件，我已经包括了原来的行作为评论在底部。
import { configureStore } from '@reduxjs/toolkit';
import { Action, createStore } from 'redux'
export type State = { context: AudioContext | null}
export const START_AUDIO = "startAudio";
const initialSta
浏览 10提问于2022-05-28得票数 2
回答已采纳
1回答
为什么我无法在React-Native Redux中从我的mapStateToProps访问我的this.state.props会话阵列？
javascript、reactjs、react-native、redux、react-redux
我正在尝试存储一个Session对象数组。每个会话都有一个Hand对象数组。我正在尝试设置Redux存储，但由于某些原因，我无法使用mapStateToProps访问我的存储。this.props.*中的所有选项都与我的redux存储无关。 我的存储应该包含一个session对象数组，我希望在创建自定义FlatList之前在一个简单的FlatList中显示这些对象，以便理解这些概念。我给出了一个使用State的示例，但我不能让它与Redux一起工作。 我的{this.props.sessions}没有显示任何内容，我希望它像状态按钮一样显示会话的名称。 我尝试了很多不同的配置，包括翻阅thi
浏览 6提问于2019-06-10得票数 1
回答已采纳
1回答
如何更新连接到redux store的组件？
reactjs、redux
我有两个组件，一个是应用程序组件，另一个是计数器component.Here应用程序组件是根组件，计数器组件是子组件。在订阅方法的索引组件中，我正在接收更新值。这里的问题是计数器组件如何接收更新，如果redux存储中有任何更改。
//index.js
import React from 'react';
import { render } from 'react-dom';
import Counter from './Counter';
import {Provider} from 'react-redux';
import {
浏览 0提问于2018-03-12得票数 0
2回答
Redux:组合减速器:意外键
reactjs、redux、redux-thunk
在我开始合并我的Redux减速器之前，我的应用程序工作得很好。但是当我组合的时候，initialState键和还原器键就混淆了。
function flash(state = [], action) {
switch (action.type) {
case FLASH_MESSAGE_UPDATED:
return _.extend({}, state, { flash: action.flash })
default:
return state
}
}
function events(state = [], action) {
switch (acti
浏览 5提问于2015-11-12得票数 51
回答已采纳
1回答
如何将一个值从传递到Redux函数？
javascript、reactjs、redux、redux-saga、react-context
如何将反应上下文中的某些内容传递到我的Redux函数中？
我有一个上下文值，我可以用这样的方法在react组件中检索它
const { connectionObject } = useMyContext();
这将允许我从上下文中获取connectionObject实例。
不过，我还在应用程序的其他部分使用redux saga。其中一个redux将需要从上下文中使用personObject。
由于Redux本身在技术上只是普通的生成器函数，所以我不能在其中使用useMyContext()检索connectionObject。例如，这是行不通的
export function* saveData
浏览 3提问于2021-12-08得票数 1
回答已采纳
7回答
为什么Redux reducer被称为reducer？
javascript、reactjs、redux、functional-programming
边学边学 我遇到了 ..。文档说明： reducer是一个纯函数，它接受前一个状态和一个操作，然后返回下一个状态。(previousState，动作) => newState。它被称为reducer，因为它是传递给Array.prototype.reduce(reducer，initialValue)的函数类型。 MDN描述了 方法如下： reduce()方法对累加器和数组的每个值(从左到右)应用一个函数，以将其减少为单个值。 我仍然不明白为什么Redux定义了一个Redux的reducer，因为它没有任何意义。其次，MDN的描述似乎也不正确。The The The 方法并不总是用
浏览 110提问于2016-11-15得票数 73
回答已采纳
2回答
combineReducers破坏了Redux状态，也破坏了多个不可变and缩减程序
reactjs、state、redux、reducers、react-redux
把我的头撞在这上面。我已经完成了典型的ReactJS和Redux应用程序教程，正在开发我自己的应用程序。问题出在使用combineReducers()为Redux存储创建单个缩减程序时。我目前有三个reducer，当它们被添加为createStore()的reducer参数时，它们可以很好地工作。第一个reducer包含我的所有操作，名为：
HeaderReducer
import { isActive } from '../actions/HeaderActions';
export const initialButtonState = {
isActive: fals
浏览 1提问于2016-04-05得票数 5
2回答
将数据写入redux中的最简单的方法是什么？
javascript、reactjs、ecmascript-6、redux
在我的应用程序中，我使用了React和Redux (以及用于异步任务的Redux-thunk )。因此，当我需要将一些数据写入store作为component交互的结果时，我会同时使用action和reducer。但它总是必要的吗？尤其是在对修改后的字段没有connect的情况下，component？我总是需要action和reducer将一些数据写入store吗？或者，也许有一种类似于setState in store的方法
浏览 7提问于2016-11-15得票数 0
回答已采纳
6回答
React-Redux -没有为关键“硬币”提供减速器
javascript、reactjs、redux、react-redux
不确定为什么会出现以下错误。 我只是在设置我的存储、操作和缩减程序，我还没有调用任何东西。 预期 应用程序运行正常，Redux状态未更新 结果 ? src/index.js import React from 'react'
import ReactDOM from 'react-dom'
import { createStore, applyMiddleware, compose } from 'redux'
import { Provider } from 'react-redux'
import thunk fr
浏览 125提问于2017-06-28得票数 48
回答已采纳
4回答
我有多个模态注册，并与它有问题。我总共有三个动作。首先是注册按钮，然后激活第一个注册模式，以便在google或facebook上注册，然后在完成模式之后，提供商无法收集的其他信息将与预先填写的输入一起显示。我在渲染应用程序时渲染了两个通道，并且仅在单击注册按钮时才显示它。我需要在完成facebook或google登录后调用componentDidMount，但它是在应用程序首次启动时呈现通道时调用的。按下动作减速键和减速键，改变bool类型的状态，是否显示模式。
class HeaderRegisterButton extends Component {
render() {
浏览 0提问于2017-02-21得票数 7
2回答
使用redux在秒表上占用一段时间并将其放入数据库
javascript、node.js、reactjs、redux
有人建议我使用redux将时间放到数据库中，但我遇到了问题。我的index.js中有一个秒表，用户可以启动和停止。之后，我有一个按钮，让他们能够把他们的时间放在一个数据库。从我的节点文件中，我得到了UnhandledPromiseRejectionWarning: error: null value in column "time" violates not-null constraint。我想知道这是因为我在索引文件的末尾有difference = 0，它没有检索difference = this.state.endTime - this.state.startTime;，或
浏览 2提问于2021-01-21得票数 0
回答已采纳
4回答
Redux应用程序中另一个组件中连接函数值的访问问题
javascript、reactjs、redux、react-redux
我已经在我的React应用程序中设置了Redux，但是当我使用this.props在一个单独的文件中访问另一个组件中的数据时，没有传递任何数据。我的操作正在执行，它传递我想要的数据。这是我的actions.js
export const ADD_CART = 'ADD_CART';
export function addCart(item){
return {
type: ADD_CART,
payload: item
}
};
我的reducer.js是：
import {ADD_CART} from './actio
浏览 6提问于2017-05-29得票数 2
回答已采纳
2回答
如何通过redux更新状态后的React组件？
javascript、reactjs、redux
我正在学习React和Redux，当我这样做的时候，我决定制作一个带有按钮的网页，点击按钮就会改变状态。在按钮下面，我想在另一个组件中显示当前状态。虽然单击按钮会更改状态，但它不会反映在组件中。下面是我的代码：
App.js
import React from 'react'
import Name from './Name'
import {changeName} from './Action';
export default function App () {
return (
<div>
浏览 0提问于2019-10-05得票数 6
2回答
Redux store.getState()返回初始值
javascript、reactjs、redux、react-redux、redux-toolkit
我已经配置了一个Redux存储，我正在尝试从一个React组件外部访问状态。我使用的是store.getState()，但是它返回存储中所有内容的初始状态值，即使存储中填充了正确的数据(在UI和dev工具中可见)。当存储被导入并通过getState()访问状态时，它似乎返回了初始值，而不是存储中的实际值。下面的代码。
store.ts
import * as _ from "@reduxjs/toolkit/node_modules/redux-thunk";
import { Action, configureStore } from "@reduxj
浏览 3提问于2022-01-20得票数 2
1回答
发送操作不会自动重新呈现应用程序。
react-native、redux、reducers
我已经从redux商店里删除了一件物品。但是它不会重新呈现应用程序。如果我手动更改应用程序，那么删除的项目就会消失。我正在做这个方法来阅读和不阅读信息。但效果很好。删除也是工作，但它不是重新渲染应用程序自动。如果我手动触发重呈现，那么消息就消失了。
Reducer.js
import { combineReducers } from 'redux'
import {
DELETE_MESSAGE,
ADD_MESSAGE,
READ_MESSAGE,
UN_READ_MESSAGE,
ARCHIVED_MESSAGE,
UN_ARCHIVED_MESS
浏览 0提问于2019-04-01得票数 1
2回答
在Redux中我应该把通用代码放在哪里呢？
reactjs、redux
我有一个使用Reactjs和Redux的应用程序。有一个action，它重置减速器的状态。我的问题是:哪里是最好的地方执行？我正在考虑两种选择：
每个减速器处理操作并重置其状态。
const reducer1 = (state = defaultState，action) => { switch (action.type) { case 'reset'：{ // .}/. }
根还原器重置全局状态
const appReducer = combineReducers({ reducer1，reducer2，reducer3 }) const rootReducer = (
浏览 2提问于2021-02-05得票数 0
4回答
Redux:只允许来自还原函数的同步调用吗？
javascript、reactjs、redux、react-redux
我有一个reactJs应用程序，现在我正在学习Redux如何使用它作为Flux实现。
我已经创建了一个商店，我创建了我的第一个减速机功能，但现在我有一些问题出现在我的脑海中，请帮助我理解。
如您所见，我有一个名为“FIND_PRODUCTS”的操作，它基本上是从后端服务中获取数据。要调用这个后端服务，我基本上是使用异步ajax调用，所以基本上我面临的问题是，在后端调用完成之前，从还原器函数返回状态，因此状态没有被正确更新，存储的订阅方得到了不正确的数据。如果切换到同步调用，这个问题就得到了解决，但是，我收到的第一个警告是，应该避免同步调用，因为它可能会降低用户体验(性能)。
所以我的问题是，我
浏览 3提问于2016-03-02得票数 3
回答已采纳
1回答
如果道具更改，则响应本机组件不重新呈现。
javascript、reactjs、react-native、redux、react-redux
没有更新我的组件，如果道具改变，但分派的行动是正确的和。反应生命周期的方法，不听道具。
只有这样，如果状态被更改，则重新呈现组件。但是shouldComponentUpdate()、getDerivedStateFromProps()和componentDidUpdate()没有实现道具的更改。
如果道具改变了，怎么能重新渲染组件？
构成部分：
import React, { Component } from 'react';
import { StyleSheet, View, Text, TextInput, TouchableOpacity } from 'rea
浏览 2提问于2020-01-31得票数 0
回答已采纳
1回答
如何在redux中更改状态？
javascript、reactjs、redux
我对redux是个新手，正在尝试在我的应用程序中实现redux。我有一个将数据渲染到屏幕的index.js，我还有另一个组件应用程序。我添加了'App‘功能作为phonebookreducer的订阅者。我在应用程序函数中添加了一些console.log，以检查在phonebookreducer中更新状态后是否会调用它。正在调用该函数，但更新后的状态不会呈现在屏幕上。但是，当我作为订阅者从index.js添加render函数时，更新后的状态将被呈现。 我的问题是，我确信当phonebookreducer的状态改变时，它会调用App函数，但为什么更新后的状态不会呈现在屏幕上。来自reac
浏览 17提问于2019-12-12得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
