React js给出错误扩展运算符

时间:2018-02-07 13:39:42

标签: reactjs react-native react-redux

我是React的新手,我在使用...(传播运营商)时面临问题。

尝试添加和删除其他模块,但没有帮助

import { createStore } from 'redux';

const initialState = {
    result : 1,
    lastValues: []
};

const reducer = (state = initialState,action) =>{
    switch(action.type){
    case "ADD":
        state : {
            ...state,
            result : state.result + action.payload
        };
    break;
    case "MULTIPLY":
        state.result *= action.payload;

    break;
    }
    return state;
};

const store = createStore(reducer);

store.subscribe( () => {
    console.log("store updated",store.getState());
});

store.dispatch({
    type : "ADD",
    payload: 10 
});

store.dispatch({
    type : "MULTIPLY",
    payload: 111
});

webpack.config.js

var path = require('path');
var config = {
    entry: './main.js',
    output: {
        path:'/public/',
        filename: 'index.js',
    },
    devServer: {
        inline: true,
        port: 9999
    },
    module: {
        loaders: [
            {
            test: /\.jsx?$/,
            exclude: /node_modules/,
            loader: 'babel-loader',
            query: {
                presets: ['es2015','react','stage-0']
            }
            },
            {
            test: /\.css$/,
            loader: 'style-loader!css-loader'
            }, 
            {
            test: /\.scss$/,
            loader: 'style-loader!css-loader!resolve-url-loader!sass-loader'
            }
        ]
    }
}
module.exports = config;

的package.json

{
    "name": "react_project",
    "version": "1.0.0",
    "description": "",
    "main": "index.js",
    "scripts": {
    "start": "webpack-dev-server --hot"
    },
    "author": "",
    "license": "ISC",
    "dependencies": {
    "@progress/kendo-react-layout": "^0.3.0",
    "babel": "^6.5.2",
    "babel-core": "^6.26.0",
    "babel-loader": "^6.4.1",
    "babel-preset-env": "^1.6.1",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-latest": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-2": "^6.24.1",
    "bootstrap": "^4.0.0",
    "prop-types": "^15.6.0",
    "react": "^16.2.0",
    "react-bootstrap": "^0.32.1",
    "react-bootstrap-tabs": "^1.0.2",
    "react-checkbox-group": "^3.3.4",
    "react-dom": "^16.2.0",
    "react-modal": "^3.1.11",
    "react-native-camera": "^0.13.0",
    "react-redux": "^5.0.6",
    "react-responsive-modal": "^2.0.0",
    "react-router": "^4.2.0",
    "react-tab-panel": "^2.2.7",
    "reactstrap": "^5.0.0-alpha.4",
    "redux": "^3.7.2",
    "webpack": "^3.10.0",
    "webpack-dev-server": "^2.11.1"
    },
    "devDependencies": {
    "babel-plugin-transform-object-rest-spread": "^6.26.0",
    "babel-preset-stage-0": "^6.24.1",
    "bootstrap-loader": "^2.0.0-beta.16",
    "css-loader": "^0.28.9",
    "style-loader": "^0.20.1"
    }
}

我尝试使用"babel-plugin-transform-object-rest-spread"并将""plugins": ["transform-decorators-legacy"]"添加到webpack.config.js,但错误即将发生。

请咨询

3 个答案:

答案 0 :(得分:1)

你需要babel插件transform-object-rest-spread

"plugins": ["transform-object-rest-spread"]

答案 1 :(得分:1)

尝试这样

npm install --save babel-plugin-transform-object-rest-spread

然后

"plugins": ["transform-object-rest-spread"]

答案 2 :(得分:0)

function todoApp(state = initialState, action) {
  switch (action.type) {
    case SET_VISIBILITY_FILTER:
      return Object.assign({}, state, {
        visibilityFilter: action.filter
      })
    default:
      return state
  }
}

将此示例用于减速器