首页 > 解决方案 > 无法在 React 中获取数组状态值

问题描述

当我尝试获取值时...this.state.users显示反应错误

反应代码

handleChange(i, e) {
        const { name, value } = e.target;
        let users = [...this.state.users];
        users[i] = { ...users[i], [name]: value };
        this.setState({ users });
    }

我的 webpack 文件

const path = require('path');
module.exports = (env) => {
    const isProduction = env === 'production';
    return {
        entry: './src/index.js',
        output: {
            path: path.join(__dirname, 'public'),
            filename: 'bundle.js',
        },
        module: {
            rules: [
                {
                    loader: 'babel-loader',
                    test: /\.js$/,
                    exclude: /node_modules/,
                },
                {
                    test: /\.css$/,
                    use: ['style-loader', 'css-loader'],
                },
            ],
        },
    };
}

错误是

 ERROR in ./src/components/Index.js
[1] Module build failed: SyntaxError: E:/Program/reactjs/check/client/src/components/Index.js: Unexpected token (47:15)

请帮我解决这个错误

标签: javascriptarraysreactjswebpack

解决方案


看来您需要正确配置 babel。根据这篇文章,您需要确保安装了 stage-0 预设:

npm install --save-dev babel-preset-stage-0

并配置:

{
  "presets":[
    "es2015", "react", "stage-0"
  ]
}

但是,如果您使用的是 Babel v7 或更高版本,则必须使用不同的安装和配置

npm install --save-dev @babel/plugin-proposal-object-rest-spread

并将其放入您的 .babelrc 文件中:

{
  "plugins": ["@babel/plugin-proposal-object-rest-spread"]
}

推荐阅读