我该如何解决在handleChange函数上遇到的语法错误？

Question

我在控制台中遇到以下错误。

处理程序有问题。

我不确定发生了什么，但是这里是整个组件代码。

import React from 'react';
import TextWidget from './TextWidget';

/*
 * Handles removing dashes from SSNs by keeping the user input in local state
 * and saving the transformed version instead
 */
export default class SSNWidget extends React.Component {
  constructor(props) {
    super(props);
    this.state = { val: props.value };
  }
  handleChange = val => {
    // If val is blank or undefined, pass undefined to onChange
    let strippedSSN;
    if (val) {
      strippedSSN = val.replace(/[- ]/g, '');
    }

    this.setState({ val }, () => {
      this.props.onChange(strippedSSN);
    });
  };
  render() {
    return (
      <TextWidget
        {...this.props}
        value={this.state.val}
        onChange={this.handleChange}
      />
    );
  }
}

Answer 1

从屏幕截图看来，您的babel配置似乎有问题。按照指南here使用您使用的构建工具正确地进行设置。另外，请确保在您的预设中添加preset/react，因为您正在使用react。

否则，您可以使用create-react-app来获取应用程序的样板。 create-react-app预先配置了babel和webpack，因此您无需进行其他设置。