Ошибка синтаксиса при обновлении состояния в React.js

Question

следующий код показывает мне синтаксическую ошибку при обновлении состояния в React.js.

import { FETCH_POSTS } from '../actions/index'; 
const INITIAL_STATE = { all:[], post: null}; 

export default (state=INITIAL_STATE,action) => { 
    switch(action.type){ 
    case FETCH_POSTS: 
    return { ...state, all: action.payload.data }; 
    default: 
    return state; 
    } 
} 

он показал мне ошибку на return { ...state,all:action.payload.data };

Answer 1

Согласно спецификации ES6, the spread operator can be applied only to iterable objects (https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Spread_operator). Вы можете использовать Object.assign или рассмотреть что-то вроде https://github.com/sebmarkbage/ecmascript-rest-spread с вашим транспилером.

Answer 2

Воспользоваться Object.assign() обновить и вернуть состояние

export default (state=INITIAL_STATE,action) => { 
    switch(action.type){ 
    case FETCH_POSTS: 
    return Object.assign({}, state, {all: action.payload.data}); 
    default: 
    return state; 
    } 
} 

Answer 3

Я была такая же проблема с тем же кодом, что и ваш, когда я начал свой проект после окончания курса https://www.udemy.com/react-redux

я разобрался что я забыл установить предустановленный-1 https://www.npmjs.com/package/webpack-preset-babel-stage-1 и включить его в webpack.config.js

module.exports = { 
    entry: [ 
    './src/index.js' 
    ], 
    output: { 
    path: __dirname, 
    publicPath: '/', 
    filename: 'bundle.js' 
    }, 
    module: { 
    loaders: [{ 
     exclude: /node_modules/, 
     loader: 'babel', 
     query: { 
     presets: ['react', 'es2015', 'stage-1'] 
     } 
    }] 
    }, 
    resolve: { 
    extensions: ['', '.js', '.jsx'] 
    }, 
    devServer: { 
    historyApiFallback: true, 
    contentBase: './' 
    } 
}; 

Answer 4

Ну, я столкнулся с той же проблемой. Не забудьте установить «babel-preset-stage-1» в своих пакетах npm и использовать его как «stage-1» при настройке пресетов для babel. Он будет работать.