Je viens de commencer à apprendre à réagir sur le site officiel et il y a cette étape dans le tutoriel dans lequel pour faire une horloge de travail, vous tournez une fonction dans une classe. Ma question est la suivante: puisque cela peut être fait d'une manière beaucoup plus simple, pourquoi quelqu'un ferait-il cela?Pourquoi quelqu'un voudrait transformer une fonction en classe en réagissant js
Répondre
Lorsque vous souhaitez avoir accès à toutes les fonctionnalités telles que React.Component
props
et state
, life cycle methods, ref
et much more, vous devez extend
de React.Component
.
Vous ne pouvez le faire avec un class
(en ES6
)
Modifier
Juste une chose, vous pouvez accéder à des accessoires trop déclarant une fonction
Ce n'est pas vrai en fait, les composants sans état ne sont que des fonctions qui retournent jsx
. ce sont des fonctions normales, normales, qui acceptent les paramètres.
Nous utilisons parfois le mot-clé props
en tant que paramètre, simplement comme une habitude ou une convention, mais vous pouvez utiliser le mot-clé que vous voulez.
Exemple:
const MyHeader = (myParams) => (
// no props here
<h2>{myParams.value}</h2>
);
class MyApp extends React.Component{
render(){
const {message} = this.props; // i get access to this.props as i extended React.Component
return(<MyHeader value={message} />);
}
}
ReactDOM.render(<MyApp message="Hello!" />, document.getElementById('root'));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id="root"></div>
Juste une chose, vous pouvez accéder aux accessoires déclarant aussi une fonction. – RMontes13
non vous ne pouvez pas car il n'y a pas de «props» dans les fonctions seulement des paramètres normaux réguliers. nous l'appelons 'props' comme convention quand vous le passez à l'élément JSX mais à l'intérieur de votre composant de fonction ils sont juste des paramètres normaux comme n'importe quelle autre fonction reçoit. –
dans React, vous avez besoin d'un composant de classe lorsque vous souhaitez React méthodes de cycle de vie (ou un arbitre à un élément de dom). Donc, la différence est la façon dont React utilise la fonction ou la classe. –
Lorsque vous devez créer un composant sans créer d'état (appelé composant sans état), il est plus facile de le créer avec une fonction. Mais lorsque vous créez un composant qui a besoin d'un état, vous devrez utiliser des classes pour le faire. – Atef