Question

我在启动reactjs项目时创建了reactjs应用程序，在索引文件的第4行获得了意外的令牌错误。索引文件如下所示。

> 4 |     static propTypes = {
    |                      ^
  5 |         value: PropTypes.string,
  6 |         onChange: PropTypes.func.isRequired
  7 |     }

以下是index.js文件

static propTypes = {
        value: PropTypes.string,
        onChange: PropTypes.func.isRequired
    }
    constructor(props) {
        super(props);
        this.state = {
            isGoing: true,
            numberOfGuests: 2,
            calendarOpened: false,
            selected: [],
            day: new Date().getDate(),
            month: new Date().getMonth() + 1,
            year: new Date().getFullYear()
        };

        this.handleInputChange = this.handleInputChange.bind(this);
        this.handleSubmit = this.handleSubmit.bind(this);
    }

    handleSubmit(event) {
        event.preventDefault();
        alert('number of guest: ' + this.state.numberOfGuests);
        alert('is going: ' + this.state.isGoing);
    }
    selectDate (evt) {
        this.setState({ selected: evt.iso, calendarOpened: false })
    }
    // this is to display different months or years
    // without it we would only have one calendar page
    changeInfo ({ day, month, year }) {
        this.setState({ day, month, year })
    }

    openCalendar () {
        this.setState({calendarOpened: true})
    }

Answer 1

发生此错误，因为标准ES6类只能有方法，而不能有属性。您必须安装babel-preset-stage-0，这会增加对类属性的支持。

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

然后配置.babelrc以使用此预设：

//...
presets: ['react', 'es2015', 'stage-0']
//...

修改

如果您不想更改当前的babel / webpack设置，您可以随时将propTypes定义移到组件之外：

ComponentName = (props) => <div>my component</div> ComponentName.propTypes { ...your prop types... }

Answer 2

你可以这样做。您无需单独安装道具类型。您可以使用React调用PropTypes，如下所示

static get propTypes(){
   return {
        value: React.PropTypes.string
    }
}

否则

您可以安装prop-types模块并定义道具数据类型

安装prop-types

npm install —save prop-types

import PropTypes from ‘prop-types’;

static get propTypes(){
   return {
     value: PropTypes.string
   }

由于您已经安装了React，因此请选择第一个选项。您无需再次安装道具类型

意外的令牌＆＃39; =＆＃39;反应js

2 个答案: