Как пространство имен классов es6 (для компонентов React)
Это часть вопросника ES6. Ответьте на вопрос. Я пытаюсь использовать компоненты с именами в React с классами ES6 и Babel. Поэтому я предполагаю, что реальный вопрос заключается в том, как назвать классы пространства es6, чтобы я мог сделать то, что объяснено здесь: https://facebook.github.io/react/docs/jsx-in-depth.html#namespaced-components
Так как я получаю неожиданную ошибку токена:
class Headline extends Component { ... }
class Headline.Primary extends Component { ...
^
Ответы
Ответ 1
Это не изменится с ES6, вам все равно придется выполнять назначение:
Headline.Primary = class Primary extends Component { … };
Однако использование классов типа Headline
в качестве пространств имен становится довольно устаревшим с ES6 (и в любом случае это была спорная практика в любом случае), вы должны использовать новую систему модулей. Экспортируйте Primary
в качестве именованного экспорта, а вместо импорта класса Headline
скорее сделайте import * as headlines from …
.
Ответ 2
объявление класса ECMAScript-6 синтаксис ожидает стандартного BindingIdentifer в качестве имени класса. Точка не является допустимым символом внутри имени идентификатора.
В контексте, используемом в ссылке в OP, "пространство имен" является объектом, а свойства добавляются к этому объекту один за другим с использованием точечной нотации для доступа к свойствам.
Вы можете реплицировать это, используя выражение класса:
'use strict'
var ns = {}
ns.MyClass = class {
constructor() {
console.log('in constructor')
}
}
new ns.MyClass()
Ответ 3
Эта ссылка
Это не совсем то, что вы пытаетесь сделать, но является альтернативой.
Другой способ сделать это почти так же, как @Bergi уже указал, но я просто уточняю его дальше:
let Headline = class Headline extends Component { }
Headline.Primary = class Primary extends Component { }
export {Headline as default}
// in another module:
import Headline from 'headline';
let headline = new Headline();
let primary = new Headline.Primary();