Erweitern der Reaktionskomponente Zusammensetzung

Question

Ich versuche, eine Komponente in React zu erweitern. Ich habe read this in the docs, dass es empfohlen wird, Komposition statt Vererbung zu verwenden, um Code zwischen Komponenten wiederzuverwenden.

Basierend darauf habe ich das Folgende implementiert und glaubte, dass dies der richtige Ansatz ist. (Es funktioniert). Siehe Code unten.

class ComponentExtension extends Component { 

    //*** extras to extend the original component here ***// 
    //*** omitted for the purposes of this question ***// 

    render() { 
    return <OriginalComponent />; 
    } 

} 

jedoch dann auf die weitere Forschung stieß ich auf Higher Order Components in the docs. Was ist der Unterschied zwischen den beiden Ansätzen? Sollten Sie einen Ansatz in einer Instanz und einen anderen Ansatz in einer separaten Instanz verwenden? Lösen sie sogar ein identisches Problem?

Answer 1

Wenn Sie die Komponente erweitern möchten, sollten Sie etwas tun:

class ComponentExtension extends OriginalComponent { 
     //*** extras ***// 
} 

Und wenn Sie HOC verwenden, können Sie nur eine Komponente in die andere wickeln.