React-redux扩展运算符在reducer中返回错误“意外标记”
React-redux是一个用于构建React应用程序的JavaScript库，它结合了React和Redux两个流行的前端开发工具。Redux是一个用于管理应用程序状态的状态管理库，而React是一个用于构建用户界面的JavaScript库。
在React-redux中，扩展运算符（spread operator）是一种用于将对象或数组的属性或元素展开的语法。它可以用于在reducer中更新状态对象，以便更轻松地处理状态的变化。
当在reducer中返回错误“意外标记”时，可能有以下几个原因：
- 语法错误：请确保使用扩展运算符的语法是正确的。在JavaScript中，扩展运算符使用三个连续的点（...）来表示。例如，正确的语法是
return { ...state, key: value };。 - reducer参数错误：reducer函数应该接收两个参数：当前状态（state）和一个表示操作的动作对象（action）。请确保你的reducer函数正确地接收了这两个参数，并且在返回状态之前正确地处理了动作对象。
- 状态对象不可变性：Redux鼓励使用不可变的状态对象。这意味着在更新状态时，应该创建一个新的状态对象，而不是直接修改原始状态对象。使用扩展运算符时，请确保你正在创建一个新的状态对象，并将旧的状态对象的属性展开到新对象中。
- 其他错误：如果以上原因都不是问题，那么可能是其他代码中的错误导致了这个问题。请检查你的代码，特别是与reducer相关的部分，查找其他可能导致错误的地方。
关于React-redux扩展运算符的更多信息，你可以参考以下链接：
请注意，以上提供的链接是为了帮助你更好地理解React-redux和扩展运算符的概念和用法，并不代表腾讯云的产品或推荐链接。
相关·内容
如果单击ADD按钮或SUBTRACT按钮，我的应用程序只是简单地增加年龄(初始设置为20)或降低年龄。
我不明白为什么我一直收到这个错误。我签入reducer.js以确保相应地使用'age‘属性初始化状态，所以我完全不知道这是什么原因造成的。我仔细检查了所有正确的依赖项，并确保所有语法都是正确的。
我认为可能导致它的另一件事是，我没有在我的reducer.js中对代码行const newState = {state}使用扩展运算符。由于某些原因，vscode不允许我使用扩展运算符。每次我这样做并运行我的应用程序时，屏幕上什么也没有出现。是否存在需要安装才能使用扩散运算符的依赖项？
以下
浏览 2提问于2020-05-21得票数 0
我正在使用react-redux，但是我看不到我的状态。当我检查我的状态时，它总是返回我的默认值。我检查我的类型，但它返回的值是真的。问题出在哪里？感谢你的帮助 我的操作： import {
SET_MENULIST
} from "../constants/Menu";
export const makeMenu = (menuList) => {
return {
type: SET_MENULIST,
menuList,
};
}; 我的Reducer： const menu = (state = {}, action) =>
浏览 13提问于2021-08-17得票数 1
回答已采纳
3回答
根据redux的文档，reducer总是给出一个新的状态副本。在一个连接的组件中，react-redux对mapStateToProps中提到的属性进行了简单的比较(旧的和新的属性)。
我的困惑是，因为redux总是提供状态的新副本，所以react-redux所做的浅层比较应该总是给出false，并且组件应该总是重新呈现。但这并没有发生。
有人能解释一下我错过了什么吗？
我认为在mapStateToProp中读取的所有属性都是对象。
浏览 0提问于2019-05-19得票数 4
我的Redux reducer有问题。在selectedSongReducer中，selectedSong被定义为null，因此它不会返回错误，但我仍然得到以下错误:错误: Reducer "selectedSong“在初始化期间返回未定义。如果传递给缩减程序的状态未定义，则必须显式返回初始状态。初始状态不能是未定义的。如果您不想为此缩减程序设置值，则可以使用null代替undefined。 以下是reducer代码： import { combineReducers } from 'redux';
const songsReducer = () => {
浏览 41提问于2021-04-07得票数 0
在我的react-native应用程序中，如果用户离线，我将使用redux-persist来显示商店中存在的数据。但是在添加redux-persist之后，我得到了错误state.merge is not a function。我认为这是一个不变性的错误。请帮我解决这个问题。 rootChangeReducer.js import * as types from '../actions/login/ActionTypes';
import Immutable from 'seamless-immutable';
const initialState = Im
浏览 101提问于2019-03-12得票数 0
最近，我偶然发现了代码库，其中每个reducer看起来如下所示。我猜他们传播initialState是为了在reducer初始化时摆脱一些“剩馀”的嵌套状态，但这有意义吗？ const initialState = {...}
const reducer = (state = {...initialState}, action) => {
...
}
浏览 17提问于2021-01-04得票数 0
2回答
我不能在我的应用程序中设置redux存储。我在控制台中没有收到任何错误。当我使用redux dev工具时，它告诉我没有检测到存储。我做错了什么？我需要更改我的mapStateToProps函数吗？到目前为止，我所关注的教程中似乎并不是这样。我的文件如下所示： index.js import React from "react";
import ReactDOM from "react-dom";
import { createStore } from 'redux';
import {Provider} from 'react-redu
浏览 11提问于2020-08-14得票数 0
回答已采纳
1回答
我用的是波纹管设置。
{
"presets": ["es2015", "react"]
}
然后，当我使用...reducers时，会得到意外的令牌错误。你知道怎么解决吗？我以为原因是减速机的设置。如果我在babelrc上加上“第一阶段”。它能解决问题。但我不想加进去。请告诉我，除了在babelrc上添加“第一阶段”之外。
谢谢!
index.js
import React from 'react';
import ReactDOM from 'react-dom';
import { createStore, c
浏览 2提问于2017-04-24得票数 1
回答已采纳
我是个新手。我创建了一个演示application.And，我试图在单击按钮时隐藏消息。1)但该操作不会在单击按钮时调用。2)当控制台页面重载时，reducer.This内部的action显示如下。
inside reducer
redux.js:30 Object {type: "@@redux/INIT"}
redux.js:31 Object {}
redux.js:29 inside reducer
redux.js:30 Object {type: "@@redux/PROBE_UNKNOWN_ACTION_j.r.h.g.s.q.b.y.b.9"}
浏览 13提问于2017-06-20得票数 0
回答已采纳
1回答
大家早上好！我有一个问题，我不能更改我的"userReducer.js"状态，也不能在"name"值输入中键入任何内容。是什么导致了这个错误？我创建了一个名为test的状态，其类型号代替了输入"name“，并且在组件"App.js”中更改了值，但是"userReducer"中的状态没有改变。
userReducer.js:
import { createSlice } from '@reduxjs/toolkit';
const slice = createSlice({
name: 'user&
浏览 6提问于2022-09-12得票数 0
我已经在我的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
回答已采纳
1回答
我已经有一段时间没有反应了，这表明，我一开始并不是很好。我想让钩子在状态下更改对象的值。它将在对象中“切换”一个active: bool密钥对值。
初始状态中的对象：
hexInfo: {
name: "Hex Squadron",
active: true,
// more stuff in object
}
Hook:
import React from 'react';
import SquadronIcon from './SquadronIcon';
imp
浏览 1提问于2021-02-01得票数 0
回答已采纳
1回答
大家好，堆栈的好朋友！我正在开发一个react-redux应用程序，并且我正在尝试更新我的reducer中一个深度嵌套结构的属性。数据结构如下，我想更新text属性：
state = {
assessment: {
requirements: [
questions: [
{
text
}
]
]
}
}
因此，我尝试了以下方法：
// reducer code...
return {
...state,
[assessmentId]: {
...state[assessmen
浏览 0提问于2018-12-12得票数 1
我试着在我的Next.js中使用Next.js，但是我一直收到这个错误
error - SyntaxError: Cannot use import statement outside a module
/Users/xx/node_modules/redux-persist/es/persistReducer.js:11
import { FLUSH, PAUSE, PERSIST, PURGE, REHYDRATE, DEFAULT_VERSION } from './constants';
这是我的_app.tsx文件，看起来如下：
<Prov
浏览 13提问于2022-04-26得票数 1
5回答
我有一个项目，其中我使用了react-redux，我有一个reducer，按照我的想法，它应该在数组中添加一个元素并返回新的数组。我怎么能做到这一点？
/*---- Reducer ----*/
case CHANGE_EVENT_USERS:
return { ...state, users: payload };
/*---- Here's my hopeless tryings ----*/
userClickHandler() {
const { id, homeFloor, avatarUrl, login } = this.props;
const u
浏览 0提问于2018-01-12得票数 2
我目前正在构建一个带有React钩子和上下文的webapp。我目前有一个工作流，它使用reducer在true和false之间切换isLightTheme的全局状态。这一切都很好，并且一切都会相应地更新/。 现在，我尝试添加具有object的第二个流。在reducer中，可以看到object已被更新为新值。每当我尝试在reducer函数的末尾return新的state时，什么都不会更新。 对于reducer来说，所有的objects似乎都是一样的吗？所以它不会更新，因为value仍然是一样的？有解决这个问题的办法吗？ 我的reducer，其中state是一个object，我用一个新的值来改变
浏览 25提问于2020-01-31得票数 1
回答已采纳
2回答
因此，我有一个要添加到array create reducer中的reducer： export default (itemsList = [], action) => {
if (action.type === 'ADD_ITEM') {
return [...itemsList, action.payload]
}
return itemList
} 删除reducer (99%表示这里有问题，但我不知道是什么)： export default (itemList = [], action) => {
if (a
浏览 34提问于2019-05-05得票数 0
但是，由于某些原因，当我第一次加载页面时，还原器函数和状态将正确执行，您可以访问数据。一旦您切换到另一个页面，然后返回到以前，它会说状态是未定义的。这是图像
以下文件中的代码如下所示
import React, { Component } from "react";
import Hook from "../../hooks/display";
import { connect } from "react-redux";
import * as actionTypes from "../../store/actions"
浏览 0提问于2019-01-24得票数 1
回答已采纳
以下是组件UserHandler的代码
import React, { Component } from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import * as actionCreators from '../../store/actions/actions';
class UserHandler extends Component {
componentDidMount() {
浏览 0提问于2018-08-27得票数 0
回答已采纳
Add.js
单击“+”按钮在state.value中不起作用
import { useDispatch } from "react-redux"
import { AddNumber } from "./action/index";
export const Add=()=>{
const dispatch = useDispatch();
return(
<>
<button onClick={() => dispatch(AddNumber())}>+</but
浏览 13提问于2022-08-24得票数 0
回答已采纳
我有一个名为Form的(功能)组件，在其中我使用useReducer()钩子设置了一个状态，如下所示： {
content: {
profile: {
firstName: 'John',
lastName: 'Doe'
},
experiences: [
{
employer: 'CompanyX',
position: 'CEO'
},
{
employer: 'CompanyY&#
浏览 11提问于2020-01-12得票数 0
回答已采纳
1回答
我正在尝试在这里设置存储，我在浏览器中有错误消息：
错误:无法在“连接(卡片)”上下文中找到“存储”。要么将根组件包装在< Provider >中，要么将自定义的React提供程序和相应的React使用者传递给connect中的连接(Card)。
Index.js
import React from 'react';
import ReactDOM from 'react-dom';
import {createStore} from "redux";
import reducer from "./Store/reducer&
浏览 0提问于2020-05-05得票数 1
回答已采纳
2回答
我是redux的新手，我正在尝试在react组件中的按钮单击事件上分派操作。但是我不能更新我在reducer中的状态。 types.js export const FETCH_USERS_SUCCESS='FETCH_USERS_SUCCESS'; action.js import {FETCH_USERS_SUCCESS} from './types';
export const fetchUsersSuccess = () =>
{
return (
{
type:FETCH_USE
浏览 21提问于2020-08-30得票数 0
当更新mapStateToProps并且props在项目组件中不被接受时，项目不会呈现，如果使用组合器，它可以工作，但如果没有组合器，项目将不会呈现 reducer.js 这是我的reducer，我在其中维护了状态，但它在这里更新了，但在项目组件中，它的渲染状态也更新了 export const initialState={
rows:[],
projectformvalue:{
projectname:"",
companyname:"",
description:"",
estimat
浏览 19提问于2018-12-24得票数 2
回答已采纳
我在我的reactjs应用程序中使用Redux。我在这里有两个疑问。
我想创建多个基于redux的组件实例
我也喜欢控制/显示存储数据给其他组件。
如何实现两者？有人帮我吗？
我试过这样做:犯了错误：
import React from "react";
import ReactDOM from "react-dom";
import { createStore } from "redux";
import { Provider } from "react-redux";
import reducer from &
浏览 0提问于2018-08-13得票数 0
回答已采纳
我有一个简单的存储，它有一个channelName属性作为它的初始状态，目前有一个简单的reducer来使用输入更新通道名称。 这是我的Store.js： import { createStore } from "redux";
import reducer from "./Reducer";
const store = createStore(reducer);
export default store; 这就是我的Reducer.js中的内容 const initialState = {
channelName: "Flying Hawk&
浏览 22提问于2020-07-27得票数 0
回答已采纳
正如标题所说，我派遣了一个行动，但我的状态没有改变。下面是一些代码：
App.js
import { createStore } from 'redux'
import reducer from './../reducer/reducer'
import { TEST } from './../reducer/actions'
// Initial store
const initialStore = {
name: "John",
count: 0
};
const store = createStore(
浏览 2提问于2021-03-17得票数 1
回答已采纳
3回答
我有一个组件，如果使用redux更改了另一个组件的状态，它应该会更新，但事实并非如此。
在mapStateToProps内部，redux操作返回正确的值。
import React, {Component} from "react";
import './DashboardContent.scss';
import * as entries from '../../../assets/demo.json';
import CategoryHeader from "./CategoryHeader/CategoryHeader";
浏览 0提问于2020-08-14得票数 0
我对Redux和React有一个奇怪的问题。状态会正确地更改，并且在mapStateToProps中我也会获得正确的新状态，但是在映射之后，组件将不会重新呈现。
这样，组件就不会重新呈现：
import React, { Component } from 'react';
import { connect } from 'react-redux';
class ListItem extends Component {
render() {
return (<li>{this.props.item.text}</li>
浏览 36提问于2018-06-10得票数 1
回答已采纳
2回答
我正在制作一个应用程序，我需要在Home组件中以数组的形式返回面板以进行映射 应用程序状态是(应该是)如下所示： {
boardsList: {
boards: An array of retrieved boards
boardCount: their length
...other stuff related to boards
}, boardList reducer： import {
HOME_PAGE_LOADED,
CHECK_IF_BOARD
} from '../constants/actiontypes'
c
浏览 11提问于2020-10-15得票数 0
回答已采纳
我有这些文件： numPadHandler (我的reducer)、configureStore (我的商店)、TestRedux (我的组件，尝试使用商店)和我的应用程序文件。 减速机： // store/reducers/numpadReducers/numpadHandler
const initialState = { valueNumPad: "1" }
function numpadHandler(state = initialState, action) {
let nextState;
浏览 25提问于2020-10-13得票数 0
3回答
我只想在我的React中集成一个新的容器，将它与Redux连接起来，只想看到它都能工作。但事实并非如此。通过this.props.selection访问减速器给了我undefined。我也不知道原因。它确实在其他容器中工作，并且减速器有一些定义良好的初始状态.-我不知道这有什么区别？我是不是错过了一些琐碎的东西？
import React, { Component } from 'react'
import { connect } from 'react-redux';
import {bindActionCreators} from 'redux
浏览 0提问于2018-11-26得票数 0
回答已采纳
在我的react项目中，我连接了redux，并添加了一个包含键和值对的对象的reducer：" key：'hello'“。我将它导入到我的reducers文件夹中的index.js中，并尝试使用MapStateToProps在容器中使用它。不管出于什么原因，它的值都没有显示出来！当我定义this.props.reducer时，返回的是正确的对象，但当我键入this.props.reducer.key时，返回的是‘console.log’。为什么会发生这种情况？我以前从来没有遇到过这个问题...
这是我的App.js
import React, { Component }
浏览 0提问于2018-03-06得票数 0
我目前正在遵循编码成瘾的“反应电话电子商务项目”，并学习使用redux而不是上下文API。我遇到一个错误：
(错误:操作可能没有未定义的"type“属性。您可能拼写错误的操作类型字符串常量。)在使用slice完全遵循文档之后。
productSlice.js
import {createSlice} from '@reduxjs/toolkit';
import {storeProducts, detailProduct} from '../data';
export const productSlice = createSlice({
nam
浏览 0提问于2021-11-25得票数 0
2回答
我意识到这一错误可能有100万零1种不同的原因，但我正在努力找出我的原因。我对Redux和Reducer中的状态处理还比较陌生，并从几个在线示例中学习了下面的代码示例，这个示例在Reducer中称为：
const updateTripsWhereVenueDeleted = (state, action) => {
debugger;
const deletedVenueId = action.venue.Id;
const originalTrips = [...state];
const newTrips = originalTrips.map((trip) =&g
浏览 1提问于2022-03-15得票数 1
回答已采纳
我正在使用typescript在基于React的应用程序中创建一个表格。我正在实现表的搜索功能。有大量的数据可以显示在表中，所以我在后端执行搜索，排序，分页。 我有一个用于表的组件，它从父组件接收数据作为道具。我使用redux的react和sagas，我从后端获取数据。我使用redux状态向组件提供数据。我正在使用reducers来改变状态。 我面临的问题是，当我重新加载数据时，我获得了数据，并使用reducer改变了状态，但它没有显示在前端。但当我第二次尝试时，它显示了数据。 我的reducer代码如下。 const dataEnteries: Reducer<any> = (
浏览 21提问于2019-03-15得票数 0
我正在开发一款应用程序，可以加载特朗普的推文，并将其可视化。现在，我将tweet放在一个.json文件中，但最终我想异步调用一个API来获取tweet。但是，我的reducer一直在switch语句中的default子句中抛出一个新的错误，我不知道为什么！我们的目标是实现FETCH_TWEETS_SUCCESS，这应该是有保证的，因为我只是导入了一个.json文件。
编辑: repo在这里：
我构建了一个useEffect()钩子，它将获取数据。同样，现在我只是传递了一个.json文件，所以整个练习有点过头了。无论如何，下面是我的应用程序，其中包含从useDispatch()钩子中分派的操作，
浏览 2提问于2019-06-12得票数 0
在Reducer的初始状态中，我使用了一个无缝不可变的变量。
export const INITIAL_STATE = Immutable({
foo:[],
})
function orderReducer(state = initialState, action) {
console.log('reducer is runnig');
switch (action.type) {
case GET_MENU: {
return state.foo.push("newData") // how to achive
浏览 0提问于2018-01-26得票数 0
我是Redux的新手，正在学习如何在React中使用它。基本上，在使用react应用程序设置Redux时，我做的一切都是正确的，但当我点击按钮增量时，我希望显示的计数器会递增1。但当我这样做时，什么都不会发生，当然，我已经检查了发送的调度和操作，但基本上一切正常。因此，我真的需要你们的帮助，这里是我使用的代码： index.js import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import App from "./App
浏览 22提问于2019-10-04得票数 0
1回答
我需要使用reducer更新我的应用程序的存储。但我想让它具有动态性，这样我就不需要编写不同的操作来更新同一级别的存储。
假设我的商店下面是这样的.
const store = { nonPersistedState : {first :"", second : "", third : ""} }
所有的第一，第二和第三都在同一级别的nonPersistedState上。
现在，如果我想更新上面三个函数中的任何一个，下面是我的action和reducer函数
//action
dispatch({type: "UPDATE_MODEL&
浏览 0提问于2018-08-22得票数 0
1回答
昨晚，我用Redux编写了一个非常基本的计数器应用程序，现在我想再次使用fetch从第三方应用程序接口获取数据。但是，我有点迷茫(因为我才刚刚开始使用redux)，我需要帮助来理解如何从这里开始并成功地使用Redux进行API调用。我的代码如下： action.js import { useDispatch } from "react-redux";
export const getData = () => async() => {
await fetch('https://api.instantwebtools.net/v1/airlines&
浏览 19提问于2021-11-15得票数 0
1回答
当我为我的项目运行webpack时，我会遇到这样的错误:React包不能解决它的一些内部模块：
ERROR in ./node_modules/react-redux/es/index.js
Module not found: Error: Can't resolve './components/Context' in '/home/.../frontend/src/node_modules/react-redux/es'
@ ./node_modules/react-redux/es/index.js 3:0-57 12:0-179
@ ./ind
浏览 0提问于2019-10-19得票数 3
回答已采纳
我见过类似的问题，但它们似乎没有帮助。我有一个React项目，我正在实现redux。 我的index.js如下： import React from "react";
import ReactDOM from "react-dom";
import { BrowserRouter } from "react-router-dom";
import { createStore } from "redux";
import { Provider } from "react-redux";
import reduce
浏览 12提问于2019-10-01得票数 1
回答已采纳
我正在使用react-redux，当我刷新reducer中的网页状态时，reducer中的gone.Is这是我在react中的代码或reducer的一个问题，当我们刷新页面时，有没有其他方法来保留状态。
浏览 3提问于2019-06-24得票数 0
2回答
因此，我有相当标准的代码，但仍然不能工作。这里怎么了？
我尝试了这个解决方案，因为我有相同的错误：，但没有成功。浏览器控制台中的错误仍然是：
Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components)
Uncaught Error: Invariant Violation: Element type is inval
浏览 1提问于2015-11-20得票数 1
回答已采纳
我从react开始尝试一些东西。但我不断地得到错误的"Uncaught TypeError: (0 , _reactRedux.combineReducers) is not a function“这是我的演示配置文件
import React from 'react'
import { render } from 'react-dom'
import { createStore, applyMiddleware,compose } from 'redux'
import { Provider } from 'react-redu
浏览 1提问于2017-07-19得票数 7
回答已采纳
3回答
我是Redux Thunk的新手，在通过单击按钮组件获取async调用之后，dispatch的操作出现了问题。
actions.js
import fetch from 'isomorphic-fetch'
export const getPosts = (json) => {
return {
type: constant.GET_POSTS,
payload: {
data: json
}
}
}
export const loadPosts () => {
re
浏览 5提问于2016-10-13得票数 1
我想在许多react-redux reducers中创建一个通用的setState操作，这样我就可以在本地和redux作用域中使用相同的语法来分发状态更新。我会在this.setState上调用本地更新，在this.props.setState上调用redux更新。 reducer案例如下所示： case "SET_STATE":
return {...state, ...action.payload} 这对于一个reducer非常有效，但如果我通过combineReducers拥有许多reducer，它会将setState操作发送给所有这些reducer。这不是我想
浏览 15提问于2019-02-27得票数 0
回答已采纳
所以我得到了这个错误，DEC_NUM不是一个函数。我正在使用react-redux创建一个计数器状态。当我点击计数器(+)时，我得到了这个错误。
下面是我的代码: Action/index.js
const INC_NUM = () => {
return {
type: "INC_NUMBER"
};
};
const DEC_NUM = () => {
return {
type: "DEC_NUMBER"
};
};
export default { INC_NUM, DEC_NUM };
Reducer/Reducer
浏览 0提问于2021-09-18得票数 1
1回答
我一直在调试这个程序，但毫无头绪，我逐字逐句地遵循教程，试图制作一个TODO应用程序，但我不知道为什么我会收到这个错误消息。
./src/cuers.js
第12行：“分派”未定义为no-undef
第13行：“分派”未定义为no-undef
components.js
import React from 'react'
class Todo extends React.Component {
render() {
const { todo } = this.props
if (todo.isDone) {
浏览 3提问于2017-08-30得票数 3
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
