2017-10-09 6 views
1

Ich habe gerade angefangen, reagieren js von der offiziellen Website und es gibt diesen Schritt in der Anleitung, in der, um eine funktionierende Uhr machen Sie eine Funktion zu machen in eine Klasse. Meine Frage ist, dass, weil es mit einem viel einfacheren Weg getan werden kann, warum würde jemand das tun?Warum sollte jemand eine Funktion in eine Klasse in Reaktion js

+1

In Reaktion, benötigen Sie eine Klasse Komponente, wenn Sie Lifecycle-Methoden reagieren wollen (oder ein ref zu einem DOM-Elemente). Der Unterschied besteht also darin, wie React die Funktion oder Klasse verwendet. –

+0

Wenn Sie eine Komponente erstellen müssen, ohne einen Status für sie erstellen zu müssen (die zustandslose Komponente genannt wird), ist es einfacher, sie mit einer Funktion zu erstellen. Wenn Sie jedoch eine Komponente erstellen, die einen Status benötigt, müssen Sie Klassen dafür verwenden. – Atef

Antwort

1

Wenn Sie den Zugriff auf alle Funktionen React.Component erhalten möchten wie props und state, life cycle methods, ref und much more, würden Sie extend von React.Component benötigen.
können Sie tun nur, dass mit einer class (in ES6)

bearbeiten

Nur eine Sache können Sie auch auf Requisiten zugreifen

Das ist nicht wahr, eine Funktion deklarieren Tatsächlich sind zustandslose Komponenten nur Funktionen, die jsx zurückgeben. Sie sind normale, reguläre Funktionen, die Parameter akzeptieren.
Wir verwenden manchmal das props Schlüsselwort als ein Parameter nur als Gewohnheit oder Konvention, aber Sie können verwenden, welches Schlüsselwort Sie wollen.

Beispiel:

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>

+0

Nur eine Sache, Sie können auch auf Requisiten zugreifen, um eine Funktion zu deklarieren. – RMontes13

+0

Nein, Sie können nicht, da es keine "Requisiten" in Funktionen gibt nur reguläre normale Parameter. Wir nennen es "Requisiten" als Konvention, wenn Sie es an das JSX-Element übergeben, aber innerhalb Ihrer Funktionskomponente sind es nur normale Parameter, die jede andere Funktion empfängt. –

Verwandte Themen