Чтобы создать React компоненты-классы без ES6, используй модуль create-react-class вместо стандартного синтаксиса ES6 классов. Этот подход предоставляет альтернативный способ определения компонентов со встроенными удобными функциями.
Определяй пропсы по умолчанию с помощью метода getDefaultProps(). Эта функция должна возвращать объект со значениями пропсов по умолчанию:
getDefaultProps: function() {
return { name: 'John' };
}
Используй метод getInitialState() для установки начального стейта. Этот метод должен возвращать объект стейта:
getInitialState: function() {
return { message: this.props.message };
}
var Greeting = createReactClass({
getDefaultProps: function() {
return { name: 'John' };
},
getInitialState: function() {
return { message: this.props.message };
},
handleClick: function() {
console.log(this.state.message);
},
render: function() {
return <h1>Hello, {this.props.name}</h1>;
}
});
Одно значительное преимущество createReactClass — это автоматическое связывание методов. Все методы, включая обработчики событий, автоматически привязываются к экземпляру компонента. Это означает, что тебе не нужно использовать .bind(this) в конструкторе или где-то ещё в коде, в отличие от ES6 компонентов-классов, где требуется ручная привязка.
Эта особенность упрощает настройку обработчиков событий и сокращает шаблонный код.
Метод getDefaultProps() в createReactClass возвращает объект, который определяет значения по умолчанию для пропсов компонента, когда они не переданы из родительского компонента.
Новый — ещё не проверен сообществом
Вы