2015-01-31 3 views
13

Я использую библиотеку, называемую реакциями-реакциями в приложении React. Чтобы лучше понять, как это работает, я читал код, но соглашение продолжает появляться, что меня смущает. Вот код ES6/JSX:Объяснить знак вопроса (?), Используемый в коде ES6/JSX

'use strict'; 

var React = require('react/addons'); 
var cx = React.addons.classSet; 

var Checkbox = React.createClass({ 

    propTypes: { 
/...code.../ 
    }, 

    render(): ?ReactElement { 
    /...code.../ 
    }, 

    onChange(e: {target: {checked: boolean}}) { 
    /...code.../ 
    } 
}); 

module.exports = Checkbox; 

Примечание render(): ?ReactElement {}. Это то, что меня смущает. Может ли кто-нибудь дать указания о том, где узнать больше об этом синтаксисе? Я ударил много тупиков через Google.

+0

Это не ES6 синтаксис afaict. – Bergi

+0

@Bergi 'render():' синтаксис синтаксиса ванили? 'onChange()' также? Я подумал что-то вроде 'render: function() {...}'. – Miles

+1

Не так, да. Как ответил FakeRainBrigand, '' 'и следующее объявление предназначены для проверки типов. 'render() {...}' - это определение метода ES6. – Bergi

ответ

16

Если вы идете к package.json из реагирующих-форм, а также посмотреть на browserify разделе:

"browserify": { 
    "transform": [ 
     [ 
     "reactify", 
     { 
      "es6": true, 
      "target": "es5", 
      "stripTypes": true 
     } 
     ] 
    ] 
    }, 

stripTypes включена. Он удаляет такие вещи, как ?ReactElement, что означает, что он maybe возвращает ReactElement (и в противном случае нуль или не определено)

{target: {checked: boolean}} означает e имеет целевое свойство, которое имеет проверяемое свойство, которое является логическим.

Это советы для Flow type checker. Вы также увидите @flow в комментарии в верхней части всех файлов, которые должны быть проверены типом. Проверка типа - это инструмент, подобный модульным испытаниям, который делает вас более уверенными в правильности вашей программы, чтобы не требовать ручного тестирования. Во многих случаях эти небольшие аннотации типа заменяют единичные тесты, которые мы в противном случае писали бы.

Если вы используете поток в вашем проекте и попытаться сделать что-то вроде:

<Checkbox /> 

Это даст вам ошибку типа, поскольку значение и OnChange необходимы подпорки. В отличие от проверки регенерации времени выполнения, это происходит без фактического запуска кода (часто, как только вы сохраняете файл).