Material-ui: Material-UI nicht kompatibel mit React 0.14

@tleunen Du bist am Ball! React 0.14 Beta wurde heute veröffentlicht.

@ hai-cea Ich habe mir einige der Probleme angesehen (ich habe ~ 50 in 21 Dateien gefunden). Dies könnte eine gute Gelegenheit für einen Meilenstein sein. Ich habe mir die Dialog- / Dialogfenster- / Overlay-Dateien angesehen und es gibt viele Kopplungen über this.refs.xxx.yyy (), sodass dies möglicherweise keine einfache Aufgabe ist. Wenn Sie einen Meilenstein für die Kompatibilität mit React 0.14 erreichen möchten, lassen Sie es mich wissen und ich kann @tleunen würde gerne beteiligt sein - ich möchte ihn nicht freiwillig zur Verfügung stellen).

Danke Jungs @tleunen!

Ich bin damit einverstanden, dies wird einige Probleme verursachen. Was ist die Alternative? Das Element in einer Variablen innerhalb des Renderings speichern?

@jkruder Bist du auf Gitter - https://gitter.im/callemall/material-ui ? Bitte senden Sie mir dort eine IM und wir werden den Ball ins Rollen bringen, wenn es darum geht, Probleme / Meilensteine ​​zu organisieren.

In den meisten Fällen sollten Komponenten keine öffentlichen Funktionen haben. Alles muss mit Requisiten oder wenn sie montiert sind übergeben werden.

Beispielsweise benötigt die Dialogkomponente nicht show und hide . Wenn es im Dom ist, wird es angezeigt, sonst nicht.

Ich fange gerade erst an, Material-UI zu verwenden, daher sind mir Probleme mit anderen Komponenten nicht sehr bewusst, aber ich denke, die meisten von ihnen könnten so umgeschrieben werden, dass sie keine öffentlichen Funktionen haben (es gibt sowieso keine anderen Möglichkeiten).
Die Sache ist, es wird eine große Veränderung gegenüber der aktuellen Version sein.

@tleunen Ich kann mich nicht mehr auf die Methoden zum

@tleunen @oliviertassinari Yeh, ich stimme euch beiden zu. Dies war eine Debatte, die wir beim Entwerfen dieser Komponente hatten. Das Problem, das wir hatten, war die Clickaway-Funktion. Wenn das Öffnen / Schließen im Status behandelt wurde, kann es sich Sorgen machen, dass es sich beim Klicken entfernt. Wenn Öffnen / Schließen als Requisiten übergeben würde, müsste jeder, der den Dialog verwendet, selbst mit Clickaway umgehen.

Eine mittlere Lösung wäre nun, dem Dialog eine onClickAway-Requisite hinzuzufügen und den Benutzer der Komponente öffnen / schließen zu lassen.

@ hai-cea Ich würde vorschlagen, den gleichen Ansatz wie https://github.com/rackt/react-modal zu verwenden. Dies ist im Grunde Ihre mittlere Lösung.

Für was anderes verwendet diese Bibliothek this.refs wenn sie mit einer DOM-Komponente interagiert, als getDOMNode() sagen? Diese Änderung in React gilt nur für Komponenten wie <div/> und <i/> , nicht wahr? Auf Ihre benutzerdefinierten Komponenten kann weiterhin wie gewohnt mit this.refs.xxx zugegriffen werden. Korrigieren Sie mich, wenn ich falsch liege. Ich habe React 0.14 noch nicht ausprobiert, aber das Gleiche ist bei HackerNews aufgetaucht.

Sie meinen, wenn React erkennt, dass sich der Verweis auf einer benutzerdefinierten Komponente befindet, wird die Komponente anstelle des DOM-Elements in der Komponente zurückgegeben?

@tleunen das ist mein Verständnis. Muss überprüft werden :)

@mull Das wäre sehr schön wenn das der Fall wäre. :) :)

@ hai- cea @mull @tleunen Nur einen kurzen Test ausgeführt und eine benutzerdefinierte Komponente (die React.Component erweitert) (this.refs.customComponent) referenziert, gibt einen Verweis auf die React-Komponente zurück, NICHT auf den zugrunde liegenden DOM-Knoten. Wenn Sie einen Verweis auf einen DOM-Knoten (div / a / img / etc) haben, gibt this.refs.domRef den Knoten zurück.

@ hai-cea Trotzdem halte ich es immer noch für eine gute Idee, nicht mehr Methoden auf this.refs.XXX aufzurufen.

@jkruder danke, froh, dass ich nicht aus meinem ... :)

ok Danke für die Recherche @jkruder. Ich denke, wir sind sicher, dies zu schließen. Obwohl ich denke, wir müssen noch einen Meilenstein von 0,14 erreichen?

Und was haltet ihr von # 1033?

Ich denke, wir können es dann schließen. Es sollte jedoch sinnvoll sein, einige der Komponenten neu zu schreiben, um das Aufrufen von Funktionen zu vermeiden. So sollten Komponenten nicht funktionieren: /

@ hai-cea Einverstanden. Ich arbeite an einem Entwurf der vorgeschlagenen Arbeit für den Meilenstein von 0,14, den ich Ihnen zur Rückmeldung senden werde.

In Bezug auf # 1033 denke ich nicht, dass wir den Sprung noch machen sollten. Ich bin alle dafür, einen separaten Zweig zu erstellen, in dem wir MUI so konvertieren können, dass es mit dem für 0.14 vorgeschlagenen kompatibel ist und die Komponenten funktionsfähiger macht (minimieren / eliminieren Sie this.refs.XXX.YYY ()).

Wenn die aktuelle Verwendung von this.ref.xxx die Material-Benutzeroberfläche nicht zusammenbricht, wenn sie zusammen mit React 0.14.0-beta1 verwendet wird, sollte der Wunsch, sich von diesem Muster zu entfernen, # 1033 blockieren. Indem Sie die Installation von Material-UI neben React 0.14.0-Beta1 vereinfachen, können Sie frühzeitig Feedback zu aktuellen Problemen erhalten. Es ist besser, dieses Feedback zu erhalten, wenn sich 0.14 noch in der Beta befindet.

Vielleicht ist eine gute Alternative (die die Erwartungen besser verwaltet) die Veröffentlichung einer Alpha / Beta / RC-Version von Material-UI auf npm, die als Peer-Abhängigkeit 0.14.0 aufweist (und darauf ausgerichtet ist, Material-UI 0.14 kompatibel zu machen). Auf diese Weise ist es für die Benutzer einfacher, vorwärts zu kommen und eventuell vorhandene Probleme zu finden / zu beheben.

@jkruder Gibt es ein Update dazu?

@ashtonwar Noch keine - Ich habe mich darauf konzentriert, einige Tests

Prost, dass du dir das angeschaut hast. Ich habe material-ui-io von # 1033 gesehen. Es scheint für einige Komponenten (Dropdowns, Schaltflächen, Snackbar) zu funktionieren, fällt aber um und stirbt bei anderen (Kontrollkästchen, Schieberegler, Umschalter). Keine anderen Migrationsversuche bekannt.

@tleunen Es stellt sich heraus, dass wir weiterhin this.refs.XXX für benutzerdefinierte Komponenten verwenden können. Danke @jkruder .

Kein Problem; Ich glaube immer noch, dass es am besten ist, wenn möglich, this.refs.doSomething() zu verwenden.

Irgendwelche Updates? React JS 0.14 RC 1 wurde gerade veröffentlicht und möchte Material-UI wirklich damit verwenden.

Gibt es hier eine Möglichkeit, die Migration auf 14 zu unterstützen?

Ich verwende Material-UI-Io in der Produktion - es scheint in Ordnung zu sein.

Ich bin also der Typ, der Material-UI-Io veröffentlicht hat, und es war ein sehr rauer und trauriger Versuch, über Material-UI zu portieren.

Ich empfehle Ihnen dringend, diese Bibliothek nicht in der Produktion zu verwenden ! Ich habe den Port erstellt und an einem Tag veröffentlicht, um Material-UI zu testen, bin aber schließlich dazu übergegangen, meine eigene Bibliothek über mdl zu erstellen

Ich würde sagen, dass der beste Weg, wie wir alle bei der Überprüfung der Material-UI auf React 14 helfen können, darin besteht, auf React 14-rc1 zu aktualisieren und die auftretenden Probleme einzeln zu melden. Es ist möglicherweise eine gute Idee, den Titel der Ausgabe mit "Reagieren Sie auf 14-rc1: Dieser spezielle Fehler tritt auf ..." zu beginnen oder die Ausgabe nur mit einem geeigneten Etikett versehen zu lassen.

Aber vielleicht auch nicht. In diesem Fall hoffe ich, dass die Lead-Betreuer mich korrigieren

https://github.com/callemall/material-ui/pull/1647

Möglicherweise müssen einige Nachbesserungen in Bezug auf Peer-Deps gegen Dev-Deps gegen Deps vorgenommen werden, und es gibt ein Problem mit anstehenden Berührungsereignissen.

In React 0.14 arbeiten onTouchCancel, onTouchEnd, onTouchMove und onTouchStart automatisch, siehe https://facebook.github.io/react/blog/#breaking -changes.
So aktivieren Sie onTouchTap ohne React-Tap-Event-Plugin:

import EventPluginHub from 'react/lib/EventPluginHub';
import TapEventPlugin from 'react/lib/TapEventPlugin';
EventPluginHub.injection.injectEventPluginsByName({ TapEventPlugin });

Haben wir noch die 300ms Verzögerung von iOS Safari?

Ich habe kein IOS ...
Im ersten Beitrag hier https://github.com/facebook/react/issues/436 wird jedoch empfohlen, TapEventPlugin als Lösung zu injizieren.
Außerdem habe ich hier https://github.com/facebook/react/commit/ff12423d639413c1934dfc2ff337b298952e99ef ein relevantes Commit gefunden.

Gibt es einen vorläufigen Zeitplan für die Unterstützung von React 14? Dieses Problem ist wirklich alt und es wäre schön, wenn es bald behoben würde!

Auch ich war sehr aufgeregt, dieses UI-Toolkit zu verwenden und Bootstrap, Foundation und sogar Elemental UI zu vermeiden ... aber ich verwende React 0.14 mit Redux und gehe nicht auf 0.13 zurück. Wie lange vor einem Update?

Ich bin mir auch nicht sicher, ob ich berechtigt bin, diese Informationen zu erfragen / bereitzustellen, aber in Bezug auf Verweise (auch nicht sicher, ob dies eine Sache von 0,14 oder 0,12 / 0,13 ist) füge ich dies normalerweise meinen Formulareingabeelementen hinzu:

In meinem Onclick-Code (oder einem anderen Handler-Code) kann ich über this.name.value auf den Wert zugreifen. Macht es sehr einfach, einen der Eingabewerte zu erhalten. Gibt es eine Chance, dass dies alles ist, was benötigt wird, um das Toolkit mit funktionierender Referenz zu aktualisieren?

+1 dazu. Habe heute material-ui gefunden und war sehr aufgeregt, es zu versuchen! Leider keine Würfel.

+1. Möchte auch die Zeitleiste dieses Updates wissen!

: +1:

Wir kommen dorthin, Leute! Siehe # 1751. Zu diesem Zeitpunkt ist etwas mehr Arbeit erforderlich, um auf die neue API react-router zu aktualisieren.

Ich würde empfehlen, den Zweig react-0.14-support auszuprobieren und Probleme mit dem Präfix [React0.14] im Titel zu melden. Sobald wir diesen Zweig voll funktionsfähig machen können, werde ich dieses Problem (endlich!) Schließen :)

Gut zu hören! Freuen Sie sich auf eine endgültige Version. Ich habe mit gearbeitet
Redux, React, React-Router, und bis jetzt ist es ein ziemlich guter Weg. Aussehen
Ich freue mich darauf, die Material-Benutzeroberfläche in diese zu integrieren.

Am Dienstag, 29. September 2015, um 13:31 Uhr, Shaurya Arora [email protected]
schrieb:

Wir kommen dorthin, Leute! Siehe # 1751
https://github.com/callemall/material-ui/pull/1751. Zu diesem Zeitpunkt a
Für das Upgrade auf die neue React-Router-API ist wenig mehr Arbeit erforderlich.

Ich würde empfehlen, den Zweig "react-0.14-support" und die Berichterstellung auszuprobieren
Probleme mit dem Präfix [React0.14] im Titel

- -
Antworte direkt auf diese E-Mail oder sieh sie dir auf GitHub an
https://github.com/callemall/material-ui/issues/1030#issuecomment -144183104
.

Cool! Ich werde Probleme stellen, wenn es etwas gibt ...

Gibt es Neuigkeiten zu einem Veröffentlichungstermin für die Unterstützung von React 0.14?

@amagdas Kennen Sie den Zweig react-0.14-support ? Es ist eine ständige Anstrengung. Probieren Sie es aus und melden Sie Probleme mit dem Präfix [React0.14]

@ shaurya947 Ja , ich bin mir dessen bewusst, aber ich kann den Zweig nicht mit npm installieren und es erneut versuchen.
Es wäre gut, eine Art Readme / Wiki zu haben, um diesen Zweig mit React 0.14 zu testen.

Sie können entweder npm link von einem Klon oder npm i 'git://github.com/callemall/material-ui#react-0.14-support' in Ihrem Projekt ausführen.

Um klar zu sein, müssen Sie die npm-Installation im Verzeichnis node_modules durchführen
nicht das Stammverzeichnis Ihres Verzeichnisses
Am 2. Oktober 2015 um 08:01 Uhr schrieb "Chia-liang Kao" [email protected] :

Sie können entweder einen npm-Link von einem Klon aus erstellen oder npm i 'git: //
github.com/callemall/material-ui#react-0.14-support 'in Ihrem Projekt.

- -
Antworte direkt auf diese E-Mail oder sieh sie dir auf GitHub an
https://github.com/callemall/material-ui/issues/1030#issuecomment -145051787
.

@amagdas dieser Zweig ist noch nicht auf npm aktiv, da er noch einige Probleme hat und in Arbeit ist.

Sie können entweder das tun , was @clkao sagte, oder, nachdem das Repository auf Ihrem Rechner klonen, wechseln auf die react-0.14-support Zweig mit git checkout react-0.14-support .

Wenn Sie danach npm i im Stammverzeichnis ausführen, werden alle Quelldateien in den Ordner lib kompiliert. Sie können diesen lib-Ordner dann in Ihrem Projekt verwenden.

Ja, getan und es funktioniert, wird Feedback geben.

Wie wäre es mit der Nutzung dieses FB-Tools, um die Änderungen automatisch vorzunehmen? https://github.com/facebook/react/blob/master/packages/react-codemod/README.md

Schauen Sie sich "Bemerkenswerte Fehlerkorrekturen" in React 0.14 an (http://facebook.github.io/react/blog/2015/10/07/react-v0.14.html):
"Klickereignisse werden von React DOM in mobilen Browsern, insbesondere in Mobile Safari, zuverlässiger verarbeitet."
...

@kinolaev Für weitere Informationen: https://github.com/callemall/material-ui/pull/1732#issuecomment -143478944

Wird react-0.14-support entfernt?

@ovaris Ich wurde zum Meister zusammengeführt.

@oliviertassinari wann wird auf npm verfügbar sein?

wann wird auf npm verfügbar sein

Ich habe keine Ahnung, wann wir eine fehlerfreie Version haben werden. Sie können jedoch Master Branch mit npm versuchen.

Sollte mit der neuesten Version v0.13.0 behoben werden
Vielen Dank an alle für Ihre Hilfe.

@oliviertassinari danke!

Dankeschön!

Irgendwelche Ideen, ob dieses Problem in der neuesten Version von material-ui noch vorhanden ist? Ich kann die meisten Komponenten verwenden, aber diejenigen, die this.refs.xxx verwenden.Wenn ich beispielsweise versuche, die DatePicker-Komponente zu verwenden, wird die Fehlermeldung "Die Eigenschaft 'show' von undefined kann nicht gelesen werden" angezeigt. Hier ist this.refs.dialogWindow undefined.

Ich bin auf reagieren 0.14.8 und Material-ui 0.14.4 ...

der gleiche Fehler

Scheint, als ob Material-UI mit React 0.14.8 und 0.14.9 nicht funktioniert und das ist erbärmlich.
Webpack gibt viele seltsame Beschwerden auf meiner Konsole aus. Verstehe nicht, was zu tun ist.

@ topgun743 Es tut dir sehr kostenlos verschenkt) als erbärmlich zu bezeichnen.

Da wurde dieses Thema React 15 geöffnet veröffentlicht wurde, welches Material-ui ist kompatibel mit. Ich schlage vor, React in Ihrem Projekt zu aktualisieren.