Redux 中的传播属性

IT技术 javascript reactjs ecmascript-6 redux
2021-05-03 03:38:03

我试图在我的减速器中使用传播属性,但它返回一个无效的语法错误。我的构建支持使用扩展运算符,因为我只在我的减速器中得到错误。

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')
          })
      }
    }

减速器.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
}
2个回答

文档

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

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

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

如果你使用 webpack,你可以通过启用stage-2预设来解决这个问题

首先安装 npm 包:

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

然后将 stage-2 添加到预设数组中webpack.config.js

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