Присвоение переменных в области видимости класса работает в React, но не в ES6

Question

Этот код ReactJS действителен и выдает желаемый результат:

import React from 'react'

class MyComponent extends React.Component {
  state = {'x': 1}

  render() {
    console.log('render: this.state:', this.state)
    return <div>{this.state.x}</div>
  }
}

export default MyComponent

Но этот очень похожий код ES6 вызывает ошибку при запуске с Node.js:

class MyComponent {
  state = {'x': 1}

  render() {
    console.log('render: this.state:', this.state)
    return <div>{this.state.x}</div>
  }
}

let c = new MyComponent()
c.render()

Вот ошибка:

$ node foo.js 
/Users/lone/foo.js:2
  state = {'x': 1}
        ^

SyntaxError: Unexpected token =

Почему второй пример приводит к ошибке, когда первый пример работает нормально с ReactJS?

Answer 1

Этот синтаксис еще не является стандартной частью javascript (в настоящее время это предложение этапа 3 ).Его можно использовать с помощью плагина свойств класса babel , чтобы преобразовать его в стандартный javascript.Скорее всего, ваш реактивный проект включает этот плагин, поэтому он работает для вас в реакции.Например, приложение Create-реакции-приложение включает в себя плагин.Без этого плагина реакция не может использовать этот синтаксис.

Answer 2

Как уже упоминалось, это еще не стандарт, и приложение create-реагировать имеет плагин транспиляции Babel. Но вы можете заставить его работать, используя флаг на Node> = 10.9. Флаг --js-flags="--harmony".

Источник