Was ist der Unterschied zwischen React-Komponente und React-Komponenteninstanz?

8

Ich lese das und es heißt:

  

Wenn eine Komponente nur ein Ergebnis von Requisiten ist, kein Zustand, der   Komponente kann als eine reine Funktion geschrieben werden, die das vermeidet   Erstellen Sie eine Komponenteninstanz reaktivieren .

Was ist der Unterschied zwischen einer Komponente und einer Komponenteninstanz?

Sind sie gleich?

BEARBEITEN:

  • Was ist der Unterschied zwischen Component und Component Instance ?

  • Wie hängen sie miteinander zusammen?

  • Konzeptionell?

  • Wie werden sie im Computerspeicher dargestellt? Wie unterscheidet sich die Darstellung?

  • Was ist eine Komponente und was ist eine Instanz dieser Komponente? (Im Speicher.) Welche Art von JS-Objekt?

  • Instanz in welchem ​​Sinne? Objektorientierter Sinn?

  • Stimmt es, dass jede Komponente (eine oder mehrere) Instanz (en) haben kann?

  • Wie viele Instanzen kann eine Komponente haben?

  • Macht es sogar Sinn zu sagen, dass eine Instanz für eine / jede reaktive Komponente erstellt werden kann?

  • Wie werden Instanzen von reaktiven Komponenten erstellt und wie werden Komponenten erstellt?

Grund zu fragen:

Ich versuche, eine Konzeptkarte der Reaktion zu erstellen, um die Terminologie und ihre Beziehung zueinander zu klären.

Hier ist ein Entwurf:

    
jhegedus 04.11.2016, 13:25
quelle

2 Antworten

4

Der grundlegende Unterschied besteht darin, dass, wenn es ein Component ist, React all seine Lebenszyklusmethoden . Dies ist nützlich, wenn Sie state in Ihrer Komponente haben. Wenn Sie diese Komponente verwenden, erstellt React ein React Component Instance , dem alle Lebenszyklusmethoden und andere Hooks hinzugefügt werden.

%Vor%

In einigen Fällen werden Sie state nicht verwenden. In diesen Fällen ist das Hinzufügen all dieser Lebenszyklusmethoden unnötig. Mit React können Sie also eine Komponente erstellen, die render allein hat. Es heißt PureComponent . Wenn Sie dies verwenden, müssen Sie kein neues Component Instance erstellen, da es hier keine Lebenszyklusmethoden gibt. Es wird nur eine Funktion sein, die props übernehmen und React Elements zurückgeben kann.

%Vor%

Hoffe, das hilft!

[Update]

Was ist ein Component und ein Component Instance ?

Technisch ist ein Component in React ein class oder ein function .

Beispiel:

%Vor%

Wenn Sie component verwenden, wird es instanziiert, mehr wie new App() . Aber, React macht es von sich aus anders.

Zum Beispiel:

%Vor%

Instanzen sind erforderlich, da jede Instanz einzeln ausgeführt werden kann. Instanzen sind eine Kopie der ursprünglichen Klasse.

Einfache Antwort ist, components ist ein Class und component Instance wird die Kopie / Instanz der Klasse sein und wird in render

verwendet

Hoffe das erklärt!

    
Pranesh Ravi 04.11.2016, 16:30
quelle
4

Um die Frage zu beantworten:

  

Wenn eine Komponente nur ein Ergebnis von Requisiten ist, also kein Zustand, kann die Komponente als reine Funktion geschrieben werden, ohne dass eine React-Komponenteninstanz erstellt werden muss.

Eine "React-Komponenteninstanz" verwendet nur Klassen, um eine React-Komponente zu instanziieren. Siehe das folgende Beispiel (es6 / JSX), das sowohl reps als auch state enthält:

%Vor%

Wenn Sie in Ihrer Komponente keinen Zustand benötigen, können Sie eine reine zustandslose funktionale Reaktionskomponente wie folgt verwenden:

%Vor%

Hier finden Sie weitere Informationen zu zustandslosen React-Komponenten, wenn diese in React 0.14 eingeführt wurden. Ссылка

Update: Wie in einigen anderen Kommentaren erwähnt und hier speziell eine Performance-Vorteile bei der Verwendung zustandsloser Komponenten ...

  

Da es keine State- oder Lifecycle-Methoden gibt, um die Sie sich kümmern müssen, plant das React-Team, in künftigen Releases unnötige Überprüfungen und Speicherzuweisungen zu vermeiden.

Ссылка

    
bradcush 04.11.2016 13:46
quelle

Tags und Links