在 Redux 中传播属性答案

【问题标题】：Spread properties in Redux在 Redux 中传播属性
【发布时间】：2016-08-25 16:44:51
【问题描述】：

我正在尝试在我的减速器中使用扩展属性，但它返回时出现无效的语法错误。我的构建支持使用扩展运算符，因为我只在减速器中得到错误。

auth_types.js

export const AUTH_USER = 'AUTH_USER'
export const UNAUTH_USER = 'UNAUTH_USER'

auth_actions.js

import { AUTH_USER, UNAUTH_USER } from './auth_types'



   export function signinUser({ email, password }) {
      return function(dispatch) {
        axios.post(`${ROOT_URL}/signin`, { email, password })
          .then(response => {
            dispatch({ type: AUTH_USER })

            browserHistory.push('/feature')
          })
      }
    }

reducer.js

import { AUTH_USER, UNAUTH_USER } from '../actions/auth_types'

export default function(state = {}, action) {
  switch(action.type) {
    case AUTH_USER:
      return { ...state, authenticated: true }
    case UNAUTH_USER:
      return { ...state, authenticated: false }
  }

  return state
}

【问题讨论】：

标签： javascript reactjs ecmascript-6 redux

【解决方案1】：

来自the documentation：

由于对象扩展语法仍然是 ECMAScript 的第 2 阶段提案，因此您需要使用 Babel 等转译器才能在生产环境中使用它。您可以使用现有的 es2015 预设，安装 babel-plugin-transform-object-rest-spread 并将其单独添加到您的 .babelrc 中的插件数组中。

{
  "presets": ["es2015"],
  "plugins": ["transform-object-rest-spread"]
}

请注意，这仍然是一个实验性语言功能提案，因此将来可能会发生变化。

【讨论】：

那行得通。语法在我项目的其他地方起作用的任何原因？
不 :) 不知道，对不起。除非您在数组、字符串或映射等可迭代对象上使用展开。
啊，它在一个数组上。谢谢

【解决方案2】：

如果您使用的是 webpack，则可以通过启用 stage-2 预设来解决此问题。

首先安装 npm 包：

npm install --save babel-preset-stage-2

然后将stage-2添加到webpack.config.js中的presets数组中：

module: {
  loaders: [
    {
      test: /\.jsx?$/,
      exclude: /node_modules/,
      loader: 'babel-loader',
      query: {
        presets:[ 'es2015', 'react', 'stage-2' ]
      }
    }
  ]
}

【讨论】：