react-dnd einfaches sortierbares Beispiel ES6 anstelle von ES7

8

Ich versuche, diesem Beispiel zu folgen:

Ссылка

Aber der Code verwendet ES7 und ich weiß nicht, wie man die Decorators und die Decorate-Abhängigkeit in dieser Datei ersetzt:

Ссылка

Ich habe versucht, über Dekorateure zu lesen, aber ich verstehe es einfach nicht. Ich hoffe, dass jemand ein ES6-Beispiel des Card.js-Codes geben kann, damit ich eine bessere Vorstellung davon bekommen kann, was vor sich geht, und dieses Beispiel für meinen eigenen Gebrauch neu schreiben kann.

    
Recur 04.11.2015, 21:18
quelle

3 Antworten

5

_.flow ist eine nette Lösung, aber es ist nicht notwendig, einen Unterstrich zu installieren und einen Import nur für diese eine Aufgabe hinzuzufügen.

DragSource() gibt eine Funktion zurück, die eine React-Komponentenklasse als Eingabe akzeptiert und eine neue React-Komponentenklasse zurückgibt, die als Ziehquelle fungiert. DropTarget() macht dasselbe. Wenn wir das wissen, können wir einfach schreiben:

%Vor%

DropTarget(/*...*/)(YourComponent) gibt eine Zielkomponentenklasse zurück, und DragSource(/*...*/) kann diese neu erstellte Komponentenklasse einlesen und eine letzte Komponentenklasse ausspeien, die sowohl ein Drop-Ziel als auch eine Ziehquelle ist.

ein wenig wortreich, aber es macht den Job fertig, ohne eine externe Bibliothek zu benutzen, wenn Sie das suchen.

    
Magenta Nova 17.08.2017 20:12
quelle
4

Sie sind wahrscheinlich über den Teil in dem Beispiel gestolpert, in dem die ES7 Dekoratoren gestapelt sind:

%Vor%

Die Lösung zum Implementieren des äquivalenten Codes in ES5 oder ES6 finden Sie hier - Ссылка - Verwenden Sie die lodash-Flow-Funktion, um die Funktionen zu kombinieren - es gibt jedoch einen kleinen Fehler im Beispielcode, in dem Array-Klammern fehlen. Der richtige Code sollte daher lauten:

%Vor%

P.S. Die Babel REPL scheint Dekoratoren nicht zu unterstützen, selbst wenn Stufe 1 aktiviert ist. Ich erhalte den folgenden Fehler:

%Vor%     
sebbulon 10.06.2016 11:17
quelle
0

Wenn Sie keine es6 \ 7 Funktionen verstehen, können Sie immer zu babeljs.io gehen und es ausprobieren. In Bezug auf Dekoratoren - Ein Funktion Dekorator akzeptiert eine Funktion, umschließt (oder dekoriert) seinen Aufruf und gibt den Wrapper zurück, der das Standardverhalten ändert. Sie können Beispiele sehen und darüber lesen: Ссылка

Hier ist Ihr Beispiel in babeljs

    
Errorpro 05.11.2015 03:06
quelle