2016-07-28 18 views
0

Wenn ich eine Funktion in einer untergeordneten Klasse überschreiben, wie kann ich die übergeordnete Version dieser Funktion aufrufen?Reagieren: rufen Sie übergeordnete Version der Funktion beim Überschreiben

sagen, dass ich zwei Komponenten AbstractList und SortableList haben in Reaktion mit:

class AbstractList extends React.Component { 
    getItems() { 
    ... 
    } 
} 

class SortableList extends AbstractList { 
    getItems() { 
    ... do sorting first 
    return super.getItems(); // QUESTION: how am I supported to actually do this? 
    } 
} 

Dank!

+0

Haben Sie versucht, diesen Code zu laufen? –

Antwort

1

Sie sollten es nicht auf diese Weise tun

Kontrolle dieses issue auf Github

Viele Menschen haben sich daran gewöhnt, zu OO Vererbung nicht nur als ein Werkzeug, sondern als primäres Mittel der Abstraktion in ihre Anwendung. Ich habe in einem Java-Shop gearbeitet, du wirst wissen, wovon ich rede. Meiner Meinung nach ist die klassische OO-Vererbung (wie in vielen populären Sprachen implementiert) nicht oft das beste Werkzeug für die meisten Jobs, lassen Sie allein alle Jobs. Aber die Situation sollte mit noch mehr Vorsicht angegangen werden, wenn die Vererbung innerhalb eines Frameworks oder Paradigmas verwendet wird, das funktionale Zusammensetzung als seine primäre Abstraktion verwendet (React). Dort sind bestimmte Muster, die wir verhindern wollen (es gibt viele seltsame Dinge, die Leute kommen können, wenn Sie Rendering mit Vererbung, die keinen Sinn machen und über einfache Zusammensetzung gerichtet sind). Es besteht auch das Risiko, Mutationen bequemer zu machen. Es (Begrenzung der Vererbung Tiefe, einige React Basisklasse Methoden endgültig) (nur bei der Verwendung mit React-Komponenten natürlich. für React-Komponente erstellen sinnvoll) - alle nicht reaktiven Verwendung von ES6-Klassen wäre nicht eingeschränkt.

Statt dieser

class AbstractList extends React.Component { 
    getItems() { 
    ... 
    } 
} 

class SortableList extends AbstractList { 
    getItems() { 
    ... do sorting first 
    return super.getItems(); 
    } 
} 

sollten Sie tun

class AbstractList extends React.Component { 
    getItems() { 
    ... 
    } 
} 

class SortableList extends React.Component { 
    render() { 
     return <AbstractList items={this.props.item}>{this.props.children}</AbstractList>; 
    } 
} 
+0

genial, Komposition über Vererbung. Klassisch :) Danke! –

Verwandte Themen