Redux、localStorage和React:刷新页面时出错
Redux是一个用于JavaScript应用程序的可预测状态容器。它是一个独立于任何特定UI库的状态管理库，常用于React应用程序中。Redux通过将应用程序的状态存储在一个单一的JavaScript对象中，使得状态的管理和更新变得简单可控。
Redux的核心概念包括：
- Store（存储）：存储应用程序的状态，并提供了一些方法来获取、更新和订阅状态的变化。
- Action（动作）：描述应用程序中发生的事件，是一个包含type属性的普通JavaScript对象。
- Reducer（归约器）：根据接收到的动作类型来更新状态，并返回一个新的状态对象。
- Dispatch（派发）：将动作发送到归约器，触发状态的更新。
Redux的优势包括：
- 可预测性：Redux使用单一的状态树来管理应用程序的状态，使得状态的变化可预测且易于调试。
- 可维护性：Redux的状态更新逻辑被封装在归约器中，使得代码结构清晰，易于维护和扩展。
- 可测试性：Redux的状态更新逻辑可以通过单元测试来验证，保证代码的质量和稳定性。
- 生态系统丰富：Redux拥有庞大的生态系统，有许多与其兼容的插件和工具，可以提供更多的功能和便利。
Redux在React应用程序中的应用场景包括：
- 大型应用程序：当应用程序的状态较为复杂且需要共享状态时，Redux可以提供一种可靠的状态管理方案。
- 异步数据流：Redux结合中间件（如redux-thunk、redux-saga）可以处理异步操作，如网络请求、定时器等。
- 时间旅行调试：Redux提供了时间旅行调试工具，可以回溯和检查应用程序状态的变化，方便调试和排查问题。
腾讯云相关产品和产品介绍链接地址：
- 云服务器（CVM）：提供可扩展的计算能力，支持多种操作系统和应用场景。产品介绍链接
- 云数据库MySQL版（CDB）：提供高可用、可扩展的MySQL数据库服务，支持自动备份和容灾。产品介绍链接
- 云存储（COS）：提供安全、稳定、低成本的对象存储服务，适用于图片、音视频、文档等数据的存储和管理。产品介绍链接
- 人工智能机器学习平台（AI Lab）：提供丰富的人工智能算法和模型，支持图像识别、语音识别、自然语言处理等应用。产品介绍链接
- 物联网套件（IoT Hub）：提供设备接入、数据采集和远程控制等物联网解决方案，支持海量设备的连接和管理。产品介绍链接
请注意，以上链接仅为示例，具体产品选择应根据实际需求和情况进行评估和决策。
相关·内容
2回答
遵循丹·阿布拉莫夫在localStorage中存储状态的方法，在执行页面刷新后，我无法保留我的应用程序的现有状态。使用redux dev工具，当我登录时，会验证状态并存储用户。当页面刷新时，日志就会清除并返回到"@@INIT“
我的index.js代码
import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware, compo
浏览 0提问于2018-02-15得票数 0
4回答
我是React和Redux框架的新手，但是我能够从redux中存储和抓取数据，而我不能在手动刷新页面时抓取数据。当时，React和Redux状态为空。
我真的很困惑，如果状态是空的，那么为什么我们要使用redux而不是localStorage / sessionStorage。
如果我做错了什么，请帮帮我。
非常感谢您的帮助。
浏览 2提问于2019-12-07得票数 1
1回答
问题:当我最初进入根时，路由器会呈现正确的页面。导航也很好。但是，当我点击refresh时，应用程序崩溃时会出现以下错误：
instrument.js:112 Uncaught TypeError: Cannot read property 'length' of undefined
这是instrument.js:112中的函数。computedStates是undefined。
/**
* Runs the reducer on invalidated actions to get a fresh computation log.
*/
function recompu
浏览 2提问于2016-05-03得票数 0
我对在React / Redux应用程序中存储登录用户详细信息的最佳位置感到困惑，这样我就可以在每条路由的标题中访问名字和姓氏之类的信息。
我将用户应用程序接口密钥(JWT)存储在localStorage中，但由于localStorage的漏洞，我认为将名字、姓氏、电子邮件等存储在XSS中是一种不好的做法。
我不希望为了返回相同的用户详细信息而在每条路由上点击API。
我尝试将它们作为session.user存储在redux存储中，当我进行页面刷新或手动更改URL时，它将被取消设置。(通过redux saga push更改路由时会维护存储)
我如何存储名字、姓氏等，以便在多个路由和页面刷新时使
浏览 28提问于2018-08-28得票数 4
3回答
我有一些状态与反应后坐力，但每当页面是手动刷新，后坐力状态被重置。
这是正常行为，因为我知道像flux和react-redux这样的其他状态管理库会这样做。
最好将其保存到localStorage中，以便将其实际保存在浏览器中(因为localStorage也是一个同步api，因此肯定也会引起一些问题)。
尽管它是一个相当新的库，但即使在手动页面刷新时，是否也有某种方式来保持状态呢？
浏览 15提问于2020-08-11得票数 8
回答已采纳
1回答
我使用Next.js(SSr)和redux。我已经成功地实现了react-使用nextjs持久化。
用户状态在登录后更新，值在redux存储中更新，同时在localStorage的存储中更新，但是每当我删除包含存储的localStorage项并刷新页面时，localStorage由存储的第一个版本即初始存储填充。我认为在再水化方面可能存在问题，但我认为PersistGate正在有效地处理它。有人能指出在实施过程中出了什么问题吗？(预先谢谢:)
_app.js
import withRedux from 'next-redux-wrapper'
import { withRout
浏览 2提问于2020-02-12得票数 1
向reduxForm注册组件后，react-intl FormattedMessages在以下状态的区域设置更改后不会更新：
import React from 'react';
import { reduxForm } from 'react-redux-form';
import { Form } from 'reactstrap';
import { FormattedMessage } from 'react-intl';
const ExampleForm = ({ handleSubmit }) => (
浏览 0提问于2018-04-25得票数 0
2回答
我知道这个问题被问了很多次，但没有一个答案对我有效。我得到了组件，它的工作是显示用户数据从react-redux，但userData可以存储在localStorage和网站的第一次加载这个localStorage被获取到redux状态，所以我得到了错误的地方，我想要显示当前登录的用户的首字母。在向mapStateToProps函数添加async/await之后，localStorage会被获取，但我仍然收到错误提示'Cannot get 0 of undefined'，使用带有预置首字母的useEffect也会给出错误。下面是我当前的代码： import React, { u
浏览 21提问于2021-03-14得票数 0
我有一个用react和redux构建的简单的“类似post”的应用程序。当用户登录时，他应该看到一个导航栏，当他没有登录时，他应该看到另一个导航栏。 我使用redux-devtools来跟踪状态变化。 问题是，当我登录时，我设置了一个本地存储令牌，当我注销时，我将该令牌设置为null。这种方法工作得很好，当我单击注销时，我在redux devtools中看到token为null，user_authenticated为false，但是当我返回主页，或者单击浏览器的back按钮时，它将恢复到login状态，然后我可以看到token的值和is_authenticated被设置为true。 当我刷新
浏览 21提问于2020-09-24得票数 0
1回答
我的App Component
我的Store
import { createStore } from 'redux';
import { persistStore, persistReducer } from 'redux-persist';
import storage from 'redux-persist/lib/storage'; // defaults to localStorage for web
import { rootReducer } from './reducers';
const persis
浏览 4提问于2021-04-12得票数 1
即使在页面重新加载之后，我仍然需要持久化redux表单字段。所以我的方法是
首先，在页面刷新之前，我的组件中的所有字段值都将保存到componentDidUpdate方法componentDidUpdate(prevProps, prevState) { prevProps.fields ? localStorage.setItem('fields', JSON.stringify(prevProps.fields)):null prevProps.fields ? localStorage.setItem('fields', JSON.stringify(
浏览 5提问于2016-09-23得票数 0
使用下面的代码，只有当我成功登录时刷新页面时，注销按钮才会显示。该功能按预期工作，因此没有任何问题。
此外，我希望在用户成功登录时，在导航栏上显示注销按钮，而不需要刷新页面。
我试过很多方法来解决这个问题，但都没有用。
在我的研究中，我遇到了一种叫做Redux Persist的东西，但我不确定它在这个场景中是否值得使用。有什么方法可以不用Redux来处理这个问题吗？
我愿意接受代码改进/代码建议。提前谢谢。
import { Navbar, Nav, Container, Button } from 'react-bootstrap';
import axios from &#
浏览 3提问于2021-08-29得票数 0
回答已采纳
import React, { Component } from 'react';
import { Link, withRouter } from "react-router-dom"
import { connect } from "react-redux"
import { compose } from "redux"
class Header extends Component {
handleLogout = (event) => {
event.preventDefault()
浏览 25提问于2020-01-13得票数 0
回答已采纳
1回答
我使用express + mongodb + redis + mongoose作为后端来提供api.
并且，使用react + react-router + redux作为我的前端.
身份验证基于sessionId + cookie。
对于前端，我使用react-router和onEnter钩子进行身份验证控制。当用户成功登录时，我将用户信息从后端保存到redux存储中。就像这样：
const auth = { username: 'novaline', isLogin: true};
到目前为止一切都很好。
问题是：当用户重新加载页面时，存储在redux存储中的数据被删除。是
浏览 1提问于2017-08-29得票数 2
回答已采纳
场景是当用户登录时，我将他的userInfo存储在本地存储中，以避免在刷新页面时丢失会话，这是我在Store.js中使用react redux的前一段代码。
// import
const reducer = combineReducers({
userLogin: userLoginReducer,
userRegister: userRegisterReducer,
// more reducers
})
const userInfoFromStorage = localStorage.getItem("userInfo")
? JSON.parse(l
浏览 1提问于2021-09-24得票数 2
当用户刷新我的应用程序中的其他页面时，我需要重定向到主页。我使用的是React router v4和redux。由于存储在重新加载时丢失，用户重新加载的页面现在是空的，因此我想将他带回一个不需要任何以前存储的数据的页面。我不想在localStorage中保留状态。
我试图在event onload中处理这个问题，但它不起作用：
window.onload = function() {
window.location.path = '/aaaa/' + getCurrentConfig();
};
浏览 0提问于2018-06-27得票数 5
1回答
所以我有4个按钮，4种不同的颜色和10个正方形，应该有最后10次点击按钮的颜色。 我在redux状态上映射以显示正方形。我还将squareColors存储在localStorage中。 当我单击一个按钮时，状态会更新，因此我应该立即看到方块中颜色的变化。但是，只有在刷新页面时才会发生这种情况。当我单击按钮时，我的App.js组件不会重新呈现。 为什么？ App.js： import React from 'react';
import { connect } from 'react-redux';
import { setColors } from '
浏览 7提问于2019-06-03得票数 0
回答已采纳
1回答
我是JavaScript的初学者，我正在使用React和Redux开发一个电子商务测试应用程序，在这里我需要持久化购物车上的数据(我正在使用本地存储)。当我将项目添加到购物车中时，它们被存储在本地存储中，当我刷新页面数据时，它们仍然保存在本地存储中。当我尝试在页面刷新后将其他项添加到购物车中时，问题就出现了，而不是添加到最初存在的项中，而是从零开始添加。
下面是这方面的代码片段：
MY REDUX ACTION
const arr = [];
export const addItem = (itemsAddedToCart) => {
const id = Math.random()
浏览 0提问于2020-04-06得票数 1
回答已采纳
我正在开发一个MERNG应用程序，但我在注销用户时遇到了问题。
所以，我有一个路由，它会把你带到一个页面，其中的url有/profile/ userID，userID是由localStorage提供的，因为我从那里获取了这个值，当我注销时，我从localStorage中删除了令牌，所以，如果没有值，它应该会带你登录页面。
现在，问题是，当我登录到/profile/userId页面，我用f5刷新页面时，如果我注销，它不会让我这样做，重定向不起作用，它只有在我不刷新页面的情况下才能起作用，这对我的应用程序来说是一个大问题，而且它实际上很奇怪。
也许是我的代码有问题，我不知道如何使用Redirect
浏览 0提问于2021-04-16得票数 1
6回答
我是React和Redux的新手，我一直在学习Stephen Grider的高级React和Redux课程，我正在做客户端的身份验证。我已经在本地存储上保存了一个令牌，在刷新页面之前，一切似乎都运行得很好。当我登录/注册时，导航更改为显示注销按钮，但是如果我手动刷新页面，导航将更改为显示登录/注册按钮。
我真的是新手，不知道我应该包括什么作为代码片段。我将保留reducer和action/index.js。另外，我的git存储库很喜欢。
操作/index.js
import axios from 'axios';
import { browserHistory } from &
浏览 1提问于2017-10-11得票数 32
1回答
我发现很难理解当token过期并执行注销操作时，最后一个操作只在页面刷新时执行。虽然当令牌过期时，401代码被抛出，但它仍然使受保护的路由可见，并且只有在刷新之后，它才会注销并登录。是应该是这样，还是不应该发生，我错过了什么？ 下面是前面的代码 import React, { useEffect } from 'react';
import { Route, Redirect } from 'react-router-dom';
import {useDispatch} from 'react-redux'
import { logoutUse
浏览 8提问于2021-01-28得票数 0
当我刷新页面时，在mapStateToProps触发和组件接收属性之前，用react-router-dom创建的受保护路由将被呈现。这会导致重定向到/login路由，尽管我已经登录了。 我有一个Redux商店，看起来像这样： const initialState = {
isAuthenticated: false,
user: {}
}; 以及一个名为App.js的组件，它包含路由： componentDidMount() {
if (localStorage.token)
setAuthToken(localStorage.token);
浏览 9提问于2019-05-11得票数 3
当我访问FeedbackDetails页面时，最初没有问题，因为从上一页(主页)加载的状态仍然可用。但是，当我试图刷新页面时，它会返回一个错误：TypeError:无法重构“反馈”的属性“title”，因为它是未定义的.
这是密码：-
主页
import React, { useEffect } from "react";
import Header from "../components/Home/Header/Header";
import Main from "../components/Home/Main/Main";
import {
浏览 4提问于2021-09-25得票数 0
2回答
我有以下情况，我有一个REST API和一个React+Redux应用程序。
当用户登录时，我将令牌保存到localStorage，基于此，如果用户返回页面，我使用令牌调用服务器/api/whoami { token }，在那里我验证令牌并返回用户详细信息，我将使用该用户详细信息更新我的Redux存储。
我的问题是，如果我刷新并希望在componentDidMount中执行某些操作，即使用户登录到Redux存储，也不会更新，因为对/api/whoami的请求尚未完成。
如何等到对/api/whoami的请求完成并设置好用户后再呈现我的应用程序呢？
对于这种问题，有没有其他的解决方案？
谢谢!
浏览 1提问于2017-06-16得票数 0
1回答
我在我的应用程序的中有一个函数，在第一次呈现时刷新用户的访问令牌(useEffect钩子)。目前，单元测试正在检查组件呈现结束时状态是如何变化的。如何使函数本身更易于测试？
我考虑过重构，让dispatch()钩子、logout()还原器和本地setLoading()状态函数作为参数传递到函数中，这样它们就可以被模拟/这样函数就可以从组件本身外部化，但是我不确定这会带来什么价值。
我明白100%的测试覆盖率是不必要的，但我正在学习，我想尽我所能做到最好。
一个小小的背景：
该应用程序使用ReduxToolkit片进行身份验证，包括用户对象和当前通过身份验证的用户的访问令牌，或者为来宾用户使用n
浏览 6提问于2022-04-18得票数 1
回答已采纳
2回答
我在react/redux和身份验证方面有一个问题--身份验证部分运行良好，我可以登录和注销。当我与一个用户注销并与另一个用户登录时，问题就会发生--它偶尔会显示以前登录的用户的数据。
我在使用react和redux。我可以看到redux中的数据在注销时被清除，所有用户或用户配置文件信息都被删除。令牌也被正确地从本地存储中删除。当我与不同的用户登录时，我可以在redux devtools中看到正确的数据是被获取的，但是显示在屏幕上的数据是不同的，是来自先前登录的用户的数据。
如果刷新页面，则会显示正确的信息。
我的问题是，数据还储存在哪里？有什么地方我需要清理吗？
我的减速机是这样的：
cas
浏览 2提问于2019-08-23得票数 1
回答已采纳
3回答
我正在开发一个应用程序，我使用React作为我的前端和React-apollo-graphql来调用我的API。
我用的是react-hooks，即反应16.8 +。
我在做什么
我安装了一个auth.js文件，当用户登录并检查令牌是否有效(我正在检查的到期时间)时，我正在存储值，但该文件只是在加载我的i，刷新或重新加载页面，这不是它应该如何工作的方式。
我的auth.js文件
const initialstate = {
user: null,
};
if (localStorage.getItem("JWT_Token")) {
const jwt_Toke
浏览 8提问于2020-05-25得票数 16
回答已采纳
4回答
我使用三元运算符来渲染使用react路由的组件。但我总是被重定向到"/“路由，而不是所需的组件，即使条件如预期。
只有当我刷新/重新加载页面时，我才能获得所需的功能。
这是我的App.js，其中包含所有路由
import React, { useEffect, useState } from 'react';
import Header from './Components/Header';
import Home from './Components/Home';
import Checkout from "./Compone
浏览 41提问于2021-10-12得票数 1
1回答
到达路由器刷新页面
、、、、
Setup：我有一个表单，它将数据发送给动作创建者，然后提交给一个API并获得结果。我想要的是当表单成功提交时，用空白输入刷新表单。
这就是组件的样子
import React, { Component } from "react";
import { bindActionCreators } from "redux";
import { connect } from "react-redux";
import { addNewProduct } from "../../redux/actions";
class Admin e
浏览 2提问于2020-05-09得票数 0
回答已采纳
翻译只适用于刷新。这似乎是因为我在App.js上使用了一个包装器，这就是为什么它不能工作。
另外，我试图为intlprovider添加一个键，翻译成功了，但是现在我所有的内部组件都得到了刷新。
在使用应用程序包装时，是否可以不刷新所有内部组件而使用reactintl？？
下面可以找到app.js、index.js和应用程序包装器：
Index.js
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import './sty
浏览 0提问于2018-11-09得票数 0
回答已采纳
1回答
我通过localStorage中的一个值来设置我的redux状态。当我导航到我的页面时，它工作得很好。但是，当我执行硬刷新时，尽管localStorage中的值是向下传递的，但状态永远不会设置。
下面是我的代码：
class SomeComponent {
componentWillMount() {
if (typeof localStorage !== 'undefined') {
console.log('I get to here...', localStorage.getItem('someValue')) //
浏览 0提问于2018-03-12得票数 0
在许多React教程中，我看到localStorage中存在令牌或其他类型的数据，用于驱动应用程序中的身份验证状态。但是，如果我要创建一个头/导航栏组件，该组件根据用户的身份验证显示指向“登录”或“注销”的链接，则似乎必须将该localStorage令牌复制为redux存储或组件中的状态，以便在身份验证状态更改时提示重新呈现。也许这会让我更困扰，但复制这些信息似乎是多余的，而且如果用户第一次访问应用程序或刷新页面时localStorage中存在预先存在的令牌，则还可能需要某种虚拟操作来正确设置身份验证状态。 有没有比我在这里描述的更好的方式来处理React应用程序中的身份验证数据？
浏览 19提问于2019-03-23得票数 1
回答已采纳
我在我的react应用程序的索引页面中有以下代码：
import React from 'react'
import ReactDOM from 'react-dom'
import {Provider} from 'react-redux'
import Router from './routes'
import {createStore, applyMiddleware, compose} from 'redux'
import thunk from 'redux-thunk'
import r
浏览 3提问于2018-04-17得票数 0
我正在使用react编写一个子组件。此子组件从其父组件获取其状态。 Class ChildDetails extends Component{
constructor(props) {
super(props);
this.state = {
messageId: this.props.messageId,
};
}
componentDidMount() {
localStorage.setItem("messageId", this.props.messageId)
浏览 40提问于2020-06-29得票数 1
回答已采纳
1回答
import * as actions from '../actions/login.Action';
let initialState = {
user: {
loggedIn: false,
userRole: "",
userEmail: "",
}
};
export default function (state = initialState, action) {
switch (action.type) {
case actions.LOGIN
浏览 0提问于2018-08-09得票数 0
回答已采纳
1回答
我是新的反应-redux和有一些困难，持久化状态，主要问题是加载状态从本地存储。我可以在没有问题的情况下将数据保存到本地存储，但是redux工具中的数据在刷新时重置。本地存储中的数据应该是正确的。我推测加载状态函数不能正常工作，因此不能正确地从本地存储中获取数据。
使用(key，data)而不是(state)的原因是我没有得到错误--“对象作为一个react子”无效“，但是它应该和使用(state)一样好。
我的localstorage.js
export const saveState = (key, data) => {
try {
const serialized =
浏览 5提问于2022-10-03得票数 0
Redux在页面重新加载时丢失状态，在我的应用程序中，我不能使用localStorage。什么是最好的选择:我不能使用localStorage的政策原因，所以坚持不帮助我。
我可以设置react路由器，以将数据保存在所有的应用程序router?... redux存储中。
浏览 1提问于2020-02-08得票数 0
回答已采纳
我正在使用react、redux和redux-persist实现一个登录表单。登录API已经从后端团队准备好了.该表单有一个“记住我”复选框，我希望从登录响应中持久化JWT令牌。
我认为实施“记住我”的正确方法是：
如果没有选中“记住我”，则应该将令牌持久化到sessionStorage。因此，当浏览器关闭时，用户应该再次登录，但不需要在切换选项卡或刷新当前页面上登录。
如果选中了令牌，则应该将令牌持久化到localStorage。即使浏览器关闭，用户仍然登录。
现在我知道，从后端的角度来看，只有令牌到期时间。
我的第一个问题是我的客户端的观点和方法是否正确。
如果是，我如何根
浏览 0提问于2019-05-12得票数 8
1回答
我在我的webapp中有react-redux和react-router，而我试图在保持redux状态的同时更改路由。我尝试了所有这些，它们都删除了redux状态：
props.history.push({ pathname: `/my-path`}); // did this using withRouter and useHistory
<Link to={'/my-path'} />cool link</Link>
我做错了什么?我怎样才能保持状态？(我不能将其保留在localStorage中的原因是，当用户关闭该页面时，数据应该会消失)
浏览 1提问于2020-11-17得票数 1
1回答
我有一个React应用程序，它使用Redux管理状态，使用React Router在不同的页面中导航。
我有一个页面/组件‘搜索鸡尾酒名称’，您可以在鸡尾酒API中搜索鸡尾酒名称。。所以你搜索，比如说'Margarita‘，你会在同一页上看到结果。
现在，如果你转到我的网站上的另一个页面，然后返回到“按鸡尾酒名称搜索”页面，你将不会再看到以前“玛格丽塔”搜索的结果。
当我返回到“按鸡尾酒名称搜索”页面/组件时，我仍然希望看到以前“Margarita”搜索的结果。
我不知道该怎么做。
我是否应该将“搜索输入”(目前，只是“按鸡尾酒名称搜索”组件中的一个状态)放在Redux切片中，然后在返
浏览 0提问于2021-05-13得票数 0
1回答
我正在尝试使用Redux将数据持久化到本地存储。我刚做了一串字母。每当我使用onclick侦听器单击元素时，每次都会看到带有随机字母的控制台日志语句，但是UI不会像使用setState()调用时那样重新呈现，直到刷新页面。我在这里错过了什么？
src/index.js
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWor
浏览 1提问于2018-07-09得票数 3
回答已采纳
1回答
文件更改时页面刷新反应
、、、、
我有一个react/redux应用程序，当文件更改并点击保存时，它会刷新页面并清除所有redux数据。我知道我可以将redux数据持久存储到本地存储。我想知道的是，当文件更改时，刷新页面是react/node服务器的默认行为吗？如果不是，我如何防止它？
浏览 23提问于2020-07-11得票数 2
回答已采纳
1回答
我正在用reactjs和redux开发我的项目，当我登录或注销时，我想在导航栏中显示不同的链接。所以当我点击Login时一切正常，但是当我点击Logout时，它不会自动改变导航栏，我必须刷新页面。有人能帮我吗？这是我的Navbar.js： import React, { useEffect, useState} from 'react'
import { useDispatch, useSelector } from 'react-redux';
import { Link,useHistory } from 'react-router-dom'
浏览 9提问于2020-09-26得票数 1
回答已采纳
1回答
隐姓埋名上的新Redux商店
、、、、
我有一个使用React + Redux构建的SPA，
一些客户端希望使用不同的凭据保持两个实例的打开(正常视图+Chrome上的隐身视图)，因为当用户刷新包含隐身窗口(引用、数组等、Redux存储)的正常窗口时，这两个实例都可以访问浏览器内存( redux数据保存在afaik中)
该应用程序使用redux-persist so，默认情况下将所有内容存储在localStorage上
有没有办法为每个隐身实例创建一个合适的redux存储？
浏览 0提问于2020-08-20得票数 0
我正在创建一个应用程序，它获取用户输入的城市列表及其各自的天气，使用openweather。因此，我希望这些城市在我刷新页面后保持不变。我知道如何使用浏览器localStorage API持久化数据。但我不知道如何通过中间件将其持久化并将其传递给提供者。
下面是我的主要Index.js文件-：
import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { createStore, apply
浏览 1提问于2018-10-30得票数 1
1回答
我有一个问题，我不确定问题是铬，反应或macOs时，我打开devtools我的组件改进机。我有关于redux-持久化摘要的简单代码:当Page1呈现用户关闭Page2时，我尝试打开第二个浏览器，如果用户关闭Page2，Page1内的一个按钮将激活以打开第二个选项卡上的Page2。当用户关闭/刷新Page1选项卡时，Page2选项卡也将关闭并清除持久化:根
我正在使用:Chrome:版本107.0.5304.110反应:18.2.0 MacOS蒙特里:12.3.1
代码示例：
App.js
import "./App.css";
import { BrowserRouter, R
浏览 19提问于2022-11-20得票数 1
回答已采纳
我正在用React，React Router和Redux做一个网站。许多路由(页面)都需要用户登录。如果用户没有像这样登录，我可以重定向到登录页面：
function requireAuth(nextState, replace) {
let loggedIn = store.getState().AppReducer.UserReducer.loggedIn;
if(!loggedIn) {
replace({
pathname: '/login',
state: {
浏览 1提问于2016-08-23得票数 54
回答已采纳
我正在使用redux工具包的createSlice制作一个购物车功能。但是在浏览器的应用程序选项卡中，localStorage的值显示为Object对象。有谁能帮我一下吗？
cartSlice.js
import { createSlice } from '@reduxjs/toolkit';
import axios from 'axios'
const cartItemsFromStorage = localStorage.getItem('cartItems') ? localStorage.getItem('carts'
浏览 6提问于2020-11-29得票数 0
1回答
对于React.js/Typescript中的redux-localstorage-simple，超过了试图存储大量数据时发生的配额错误(实际上是与tilemap坐标数据相关的对象数组)。我确信这是因为某个主机的本地存储限制已经超过了。
重新加载页面会初始化redux存储，因此我不得不使用redux-localstorage-simple库来避免数据丢失。
在这种情况下，我应该使用哪种方法来避免超过配额错误
浏览 11提问于2022-02-09得票数 0
如果状态为true，我将尝试显示警报消息。此外，每次当localStorage为true时，我都会尝试将该状态保存在localStorage中以显示警报。在页面刷新时，我正在尝试删除localStorage。 import React, {
useEffect, useState
} from 'react';
const MainClass = () => {
const [alert, setAlert] = useState(false);
useEffect(() => {
setAlert(true);
if (alert
浏览 22提问于2020-09-10得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
