При создании компонентов React следует использовать функциональные компоненты, React.createClass или расширять React.Component?

Я совершенно новый, чтобы реагировать и много читал об этом. Я пришел через три различных методов для создания компонентов:При создании компонентов React следует использовать функциональные компоненты, React.createClass или расширять React.Component?

Функциональные компоненты:

const Hello = ({world}) => { 
    return (
    <div>{"Hello" + world}</div> 
);  
}

React.createClass (Factory):

const Hello = React.createClass({ 
    render: function() { 
    return <div>{"Hello" + this.props.world}</div> 
    } 
});

ES6 Класс Расширяет

class Hello extends React.Component { 
    render() { 
    return (
     <div>{"Hello" + this.props.world}</div> 
    ); 
    } 
}

Помимо очевидного, что функциональные компоненты не имеют никакого состояния, связанного с ним, и, вероятно, это более функциональный подход к выполнению компонентов, почему я должен использовать разные методы?

В документации по реагенту используются все три метода. Некоторые из статей Stack Overflow предлагают метод класса, а затем некоторые предлагают метод Factory.

источник

2016-10-16 worker11811

Использование функциональных компонентов рекомендуется для компонентов, не имеющих гражданства.

Использование React.Component рекомендуется использовать, если вы работаете с кодом ES6 +/TypeScript. React Native имеет поддержку только для создания такого типа компонентов.

React.createClass предназначен для использования с ES5.

Браузеры вскоре получат полную поддержку, и Facebook рекомендует использовать React.Component instead of React.createClass и использовать functional for stateless.

Редактировать

Facebook добавил deprecation warning to React.createClass in React 15.6.0 и указывает пользователям использовать create-react-class вместо.

источник

2016-10-16 11:03:16

Но Facebook также рекомендует использовать [функциональный] (https://facebook.github.io/react/blog/2015/12/18/react-components -элементы-и-экземпляры.html # components-can-be-classes-or-functions) – worker11811

Они рекомендуют использовать _функциональные компоненты stateless_ для тех компонентов, в которых вам не нужно сохранять состояние и не нужны методы жизненного цикла (onComponentDidMount, shouldComponentUpdate и т. д.) – Dymos

I предположим, что это [ссылка] (https://facebook.github.io/react/docs/reusable-components.html#stateless-functions) объясняет это. Используйте функциональные компоненты как можно дальше (в будущем будут оптимизированы рабочие характеристики). Это рекомендуется. Если в компоненте используются синтаксис класса ES6, то в качестве локального состояния или привязки жизненного цикла необходимо использовать синтаксис класса ES6. – worker11811

Как я знаю, рекомендуется использовать функциональный компонент, когда вам нужно просто создать представляющий логический компонент. Для компонента, который имеет любую логику, мы используем smth, как React.createClass().

Есть два способа сделать это:

Первые, вы создаете компонент общего и чем разделить его на презентационный логики и бизнес-логики.

Второй, вы можете создать их рядом.

Будьте осторожны! Разделяя эти компоненты, ваша бизнес-логика должна сделать вашу презентационную логику!

Более практика см учебники по Codecademy

источник

2016-10-17 17:06:37

При создании компонентов React следует использовать функциональные компоненты, React.createClass или расширять React.Component?

ответ

Смежные вопросы