Pull to refresh

React v0.13 RC

Reading time 3 min
Views 10K
Original author: Paul O'Shannessy
За выходные мы выпустили первый (и надеемся последний) пре-релиз React v0.13!

Мы уже немного говорили о грядущих изменениях. Основное — это конечно же поддержка ES6 классов. Подробнее в нашем анонсе беты. Мы очень взволнованы этим событием! Себастьян также написал сегодня утром о некоторых изменениях с ReactElement. Мы надеемся, что изменения, над которыми мы работатли, улучшат производительность и ощущения от разработки.


Пре-релиз доступен для скачивания:


Мы также опубликовали 0.13.0-rc1 версию react и react-tools в npm и react в bower.

Изменения


Ядро React

Критические изменения

  • Изменение props после того, как элемент был создан, устарело. В dev-режиме вы получите предупреждение; следующие версии React будут включать в себя оптимизации, предполагая, что props — константа.
  • Статические методы (определенные в statics) больше автоматически не привязываются к компоненту.
  • Порядок определения ref немного изменился так, что ссылка на компонент доступна сразу после вызова метода componentDidMount; это изменение будет заметно, если ваш компонент вызывает родительский коллбэк внутри componentDidMount, а это анти-паттерн и этого следует избегать не смотря ни на что.
  • Изменения после вызова setState теперь всегда применяются в пакетном режиме, а значит асинхронны. Раньше первый вызов, при первом подключении (mount) компонента был синхронным.
  • Вызов setState и forceUpdate на отключенном (unmounted) компоненте теперь выкидывает предупреждение, вместо исключения. Это помогает избежать проблем с производительностю в промисах.
  • Доступ к большинству внутренних свойств был полностью удален, включая this._pendingState и this._rootNodeID.


Новые возможности

  • Поддержка ES6 классов для создания компонентов React; подробнее
  • Добавлено новое API React.findDOMNode(component), его нужно использовать, вместо component.getDOMNode(). Базовый класс для компонентов основанных на ES6-классах не имеет метода getDOMNode.
  • Новый стиль для ref, позволит использовать коллбэк, вместо названия:
    <Photo ref={(c) => this._photo = c} />
    так можно сослаться на компонент с this._photo (вместо ref="photo" что даст this.refs.photo)
  • Первый аргумент метода this.setState() может быть функцией, для транзакционных обновлений состояния, например
    this.setState((state, props) => ({count: state.count + 1}));
    Это значит, что вам больше не нужно использовать this._pendingState, которого больше нет.
  • Поддержка итераторов и immutable-js последовательностей в this.props.children.


Устаревшее

  • ComponentClass.type устарел. Используйте просто ComponentClass, обычно так:
    element.type === ComponentClass

  • Некоторые методы, доступные в компонентах, созданных с помощью createClass были удалены, или устарели из-за ES6 классов, например: getDOMNode, setProps, replaceState.


React c дополнениями

Устаревшее

  • React.addons.classSet устарел. Эта функциональность может быть заменена некоторыми свободно доступными модулями. Например classnames один из таких модулей.


React Tools

Критические изменения

  • При использовании синтаксиса ES6, методы class больше не перечисляемы по умолчанию, это требование Object.defineProperty; если вы поддерживаете браузеры, такие как IE8, можно использовать флаг
    --target es3, который восстановит старое поведение.


Новые возможности

  • Опция --target для команды jsx, позволяет указать версию ECMAScript.
    • es5 по умолчанию.
    • es3 восстанавливает предыдущее поведение по умолчанию. Также делает использование зарезервированных слов безопасным, например this.static заменится на this['static'] для совместимости с IE8.

  • Преобразования для spread-оператора были также включены.


JSX

Критические изменения

  • Изменение затрагивает то, как JSX парсится, особенно использование > или } внутри элемента. Раньше это трансформировалось в строку, теперь это будет ошибка парсинга. Мы выпустим инструмент для поиска и исправления потенциальных проблем в JSX коде.
Tags:
Hubs:
+24
Comments 2
Comments Comments 2

Articles