Material-ui: Material-UI tidak kompatibel dengan React 0.14

Dibuat pada 3 Jul 2015  ·  59Komentar  ·  Sumber: mui-org/material-ui

Karena perubahan pada refs dimiliki React 0.14 . Saya pikir Material-UI akan memiliki banyak masalah dengan hampir setiap komponen pustaka.

this.refs.XXX akan mengembalikan simpul DOM alih-alih komponen, yang berarti kita tidak dapat memanggil fungsi komponen apa pun di dalamnya.

Semua 59 komentar

@tleunen Anda siap

@ hai-cea Saya melihat beberapa masalah (saya menemukan ~ 50 di 21 file). Ini bisa menjadi peluang bagus untuk sebuah pencapaian. Saya melihat file dialog / dialog-window / overlay dan ada banyak penggandaan melalui this.refs.xxx.yyy () jadi ini mungkin bukan tugas yang mudah. Jika Anda ingin membuat pencapaian Kompatibilitas React 0.14, beri tahu saya dan saya dapat membantu menulis masalah (saya yakin @tleunen ingin terlibat - saya tidak ingin menjadi sukarelawannya).

Terima kasih teman-teman @tleunen!

Saya setuju, ini akan menyebabkan beberapa masalah. Apa alternatifnya? Simpan elemen ke dalam variabel di dalam render?

@jkruder Apakah Anda menggunakan gitter - https://gitter.im/callemall/material-ui ? Kirimkan saya IM di sana dan kami akan mulai mengatur masalah / pencapaian.

Sebagian besar waktu, komponen seharusnya tidak memiliki fungsi publik. Semuanya harus dilewati dengan props atau saat dipasang.

Misalnya, komponen Dialog tidak memerlukan show dan hide . Jika ada di dom, itu akan ditampilkan, jika tidak maka tidak.

Saya baru saja mulai menggunakan Material-UI jadi saya tidak terlalu menyadari masalah dengan komponen lain, tetapi saya pikir kebanyakan dari mereka dapat ditulis ulang untuk tidak memiliki fungsi publik (Pokoknya tidak ada pilihan lain).
Masalahnya, ini akan menjadi perubahan besar dari versi saat ini.

@tleunen Saya sangat setuju tentang metode Dialog show dan hide.

@tleunen @oliviertassinari Yeh, saya setuju dengan kalian berdua. Ini adalah perdebatan kami saat merancang komponen itu. Masalah yang kami miliki adalah fitur clickaway. Jika buka / tutup ditangani dalam status, maka itu bisa khawatir tentang menutup sendiri saat clickaway. Jika buka / tutup diteruskan sebagai props, semua orang yang menggunakan dialog harus menangani clickaway sendiri.

Sekarang solusi tengah adalah menambahkan prop onClickAway ke dialog dan membiarkan pengguna komponen membuka / menutup.

@ hai-cea Saya akan menyarankan untuk menggunakan persetujuan yang sama seperti https://github.com/rackt/react-modal. Ini pada dasarnya adalah solusi tengah Anda.

Hal lain apa yang pustaka ini gunakan this.refs saat berinteraksi dengan komponen DOM selain mengatakan getDOMNode() ? Perubahan di React ini hanya berlaku untuk komponen seperti <div/> dan <i/> bukan? Komponen ubahsuaian Anda masih dapat diakses dengan this.refs.xxx seperti biasa. Koreksi saya jika saya salah, saya belum mencoba React 0.14, tetapi hal yang sama muncul di HackerNews.

Maksud Anda, jika React mendeteksi ref ada pada komponen khusus, itu akan mengembalikan komponen alih-alih elemen DOM di dalam komponen?

@tleunen itulah pemahaman saya. Perlu verifikasi :)

@mull Itu akan sangat bagus jika itu masalahnya. :)

@ hai-cea @mull @tleunen Lakukan pengujian cepat dan ref pada komponen kustom (sesuatu yang memperluas React.Component) (this.refs.customComponent) akan mengembalikan referensi ke komponen React BUKAN node DOM yang mendasarinya. Jika Anda memiliki referensi ke simpul DOM (div / a / img / etc) maka this.refs.domRef akan mengembalikan simpul tersebut.

@ hai-cea Meskipun demikian, saya masih berpikir itu ide yang baik untuk beralih dari metode panggilan di this.refs.XXX.

@jkruder terima kasih, senang saya tidak berbicara tentang ... :)

ok Terima kasih telah melakukan penelitian @jkruder. Saya pikir kita aman untuk menutup ini. Meskipun, saya pikir kita masih perlu melakukan pencapaian 0,14?

Juga, apa pendapat kalian tentang # 1033?

Saya kira kita bisa menutupnya nanti. Tetapi sebaiknya menulis ulang beberapa komponen untuk menghilangkan kebutuhan akan fungsi pemanggil pada mereka. Bukan bagaimana seharusnya komponen bekerja: /

@ hai-cea Setuju. Saya sedang mengerjakan draf pekerjaan yang diusulkan untuk pencapaian 0,14 yang akan saya kirimkan kepada Anda untuk mendapatkan masukan.

Berkenaan dengan # 1033, saya rasa kita tidak harus melakukan lompatan dulu. Saya semua untuk membuat cabang terpisah di mana kita dapat mengubah MUI sehingga kompatibel dengan apa yang diusulkan untuk 0.14 dan membuat komponen lebih fungsional (minimalkan / hilangkan this.refs.XXX.YYY ()).

Jika penggunaan this.ref.xxx saat ini tidak benar-benar merusak material-ui ketika digunakan bersama dengan react 0.14.0-beta1 maka saya tidak merasa keinginan untuk menjauh dari pola itu seharusnya memblokir # 1033. Dengan mempermudah penginstalan material-ui bersamaan dengan react 0.14.0-beta1, Anda akan menyiapkan diri untuk menerima umpan balik awal tentang masalah aktual yang mungkin muncul; lebih baik menerima umpan balik itu ketika 0,14 masih dalam versi beta.

Mungkin alternatif yang baik (yang mengelola ekspektasi dengan lebih baik), adalah merilis versi alfa / beta / rc dari material-ui pada npm yang memiliki 0.14.0 sebagai dependensi peer (dan diarahkan untuk membuat material-ui 0.14 kompatibel). Dengan begitu, lebih mudah bagi orang untuk bergerak maju dan menemukan / memperbaiki masalah yang mungkin ada.

@jkruder Ada pembaruan tentang ini?

@ashtonwar Belum ada - Saya telah berfokus untuk menetapkan beberapa pengujian dan menyelesaikan beberapa komitmen eksternal. Saya harus memiliki waktu minggu ini untuk melihatnya dan melihat apa yang sedang kami kerjakan. Beberapa orang lain telah mencoba bermigrasi ke 0.14.

Bersulang untuk melihat ini. Saya telah melihat material-ui-io dari # 1033. Tampaknya berfungsi untuk beberapa komponen (dropdown, tombol, snackbar) tetapi jatuh & mati pada yang lain (kotak centang, slider, toggle). Tidak mengetahui adanya upaya lain untuk bermigrasi.

@tleunen Ternyata kita masih bisa menggunakan this.refs.XXX untuk komponen kustom. Terima kasih @jkruder .

Tidak masalah; Saya masih percaya bahwa yang terbaik adalah menghindari penggunaan this.refs.doSomething() jika memungkinkan.

Ada pembaruan? React JS 0.14 RC 1 baru saja dirilis dan benar-benar ingin menggunakan Material-UI dengannya.

sama di sini, apakah ada cara kita dapat mendukung migrasi ke 14?

Saya menggunakan material-ui-io dalam produksi - sepertinya OKE.

Jadi saya adalah orang yang menerbitkan material-ui-io dan itu adalah upaya yang sangat kasar dan menyedihkan untuk memindahkan material-ui.

Saya sangat menyarankan Anda untuk tidak menggunakan perpustakaan ini dalam produksi ! Saya membuat port dan menerbitkannya dalam sehari untuk menguji materi-ui, tetapi akhirnya beralih ke membuat perpustakaan saya sendiri di atas mdl

Saya akan mengatakan bahwa cara terbaik kita semua dapat membantu mendapatkan materi-ui diperiksa di React 14 adalah dengan meningkatkan ke React 14-rc1 dan melaporkan masalah yang muncul satu per satu. Memulai judul masalah dengan "React 14-rc1: error spesifik ini terjadi ...." atau membiarkan masalah ditandai dengan label yang sesuai mungkin merupakan ide yang bagus.

Tapi mungkin tidak, dalam hal ini saya berharap pengelola utama mengoreksi saya

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

Mungkin perlu beberapa perbaikan terkait peer-deps vs dev-deps vs deps dan ada masalah dengan peristiwa sentuh yang tertunda.

Di React 0.14 onTouchCancel, onTouchEnd, onTouchMove, onTouchStart bekerja secara otomatis, lihat https://facebook.github.io/react/blog/#breaking -changes.
Untuk mengaktifkan onTouchTap tanpa plugin react-tap-event:

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

Apakah iOS Safari masih memiliki penundaan 300ms?

Saya tidak punya IOS ...
Tetapi di posting pertama di sini https://github.com/facebook/react/issues/436 , menyuntikkan TapEventPlugin disarankan sebagai solusi.
Selain itu di sini https://github.com/facebook/react/commit/ff12423d639413c1934dfc2ff337b298952e99ef saya telah menemukan komit yang relevan.

Apakah ada jadwal tentatif untuk mendukung React 14 ?? Masalah ini sangat tua dan alangkah baiknya jika segera diselesaikan!

Saya juga sangat senang menggunakan toolkit UI ini dan menghindari Bootstrap, Foundation, dan bahkan Elemental UI ... tetapi saya menggunakan React 0.14 dengan Redux dan tidak akan kembali ke 0.13. Berapa lama sebelum pembaruan?

Juga, tidak yakin saya memenuhi syarat untuk menanyakan / memberikan info ini, tetapi sehubungan dengan referensi, (juga tidak yakin apakah ini adalah 0,14 hal .. atau 0,12 / 0,13) Saya biasanya menambahkan ini ke elemen masukan formulir saya:

Dalam kode onclick (atau pengendali apa pun) saya, saya dapat mengakses nilai melalui this.name.value. Sangat mudah untuk mendapatkan nilai masukan apa pun. Adakah kemungkinan hanya ini yang diperlukan untuk memperbarui toolkit dengan ref yang berfungsi?

+1 ini. Menemukan material-ui hari ini dan sangat bersemangat untuk mencobanya! Sayangnya, tidak ada dadu.

+1. Juga ingin tahu garis waktu pembaruan ini!

: +1:

Kami menuju ke sana, teman-teman! Lihat # 1751. Pada titik ini, dibutuhkan sedikit lebih banyak pekerjaan untuk meningkatkan ke api react-router .

Saya akan merekomendasikan untuk mencoba cabang react-0.14-support dan melaporkan masalah apapun dengan prefiks [React0.14] di judulnya. Setelah kami dapat membuat cabang itu berfungsi penuh, saya akan menutup masalah ini (akhirnya!) :)

Senang mendengarnya! Nantikan versi final. Saya telah bekerja dengan
Redux, React, react-router, dan sejauh ini cara yang cukup bagus untuk digunakan. Lihat
teruskan untuk memasukkan UI Material ke dalamnya.

Pada hari Selasa, 29 Sep 2015 jam 13.31, Shaurya Arora [email protected]
menulis:

Kami menuju ke sana, teman-teman! Lihat # 1751
https://github.com/callemall/material-ui/pull/1751. Pada titik ini a
sedikit lebih banyak pekerjaan yang diperlukan untuk meningkatkan ke api react-router yang baru.

Saya akan merekomendasikan untuk mencoba cabang dan pelaporan react-0.14-support
masalah apa pun dengan awalan [React0.14] di judul

-
Balas email ini secara langsung atau lihat di GitHub
https://github.com/callemall/material-ui/issues/1030#issuecomment -144183104
.

Keren! Saya akan menempatkan masalah jika ada sesuatu ...

Adakah berita tentang tanggal rilis untuk dukungan React 0.14?

@amagdas apakah Anda mengetahui cabang react-0.14-support ? Ini upaya berkelanjutan. Jangan ragu untuk mengujinya dan melaporkan masalah apa pun dengan awalan [React0.14]

@ shaurya947 Ya, saya menyadarinya, tetapi saya tidak dapat menginstal cabang menggunakan npm, coba lagi.
Memiliki semacam Readme / wiki tentang cara menguji cabang ini menggunakan react 0.14 akan lebih baik.

Anda dapat npm link dari klon atau melakukan npm i 'git://github.com/callemall/material-ui#react-0.14-support' dalam proyek Anda.

Untuk memperjelas Anda perlu melakukan npm install di direktori node_modules
bukan root direktori Anda
Pada tanggal 2 Okt 2015 08:01, "Chia-liang Kao" [email protected] menulis:

Anda dapat menautkan npm dari klon atau melakukan npm i 'git: //
github.com/callemall/material-ui#react-0.14-support 'dalam proyek Anda.

-
Balas email ini secara langsung atau lihat di GitHub
https://github.com/callemall/material-ui/issues/1030#issuecomment -145051787
.

@amagdas cabang ini belum aktif di npm karena masih memiliki beberapa masalah dan sedang dalam proses.

Anda dapat melakukan apa yang dikatakan @clkao , atau, setelah mengkloning repositori pada mesin Anda, beralihlah ke cabang react-0.14-support menggunakan git checkout react-0.14-support .

Setelah itu ketika Anda menjalankan npm i di direktori root, semua file sumber dikompilasi ke dalam folder lib . Anda kemudian dapat menggunakan folder lib ini dalam proyek Anda.

Yup, melakukan ini dan berhasil, akan memberi umpan balik.

Bagaimana memanfaatkan alat FB ini untuk membuat perubahan secara otomatis? https://github.com/facebook/react/blob/master/packages/react-codemod/README.md

Lihat "Perbaikan bug penting" dalam reaksi 0.14 mengumumkan (http://facebook.github.io/react/blog/2015/10/07/react-v0.14.html):
"Peristiwa klik ditangani oleh React DOM dengan lebih andal di browser seluler, terutama di Safari Seluler."
...

@kinolaev Untuk detail lebih lanjut: https://github.com/callemall/material-ui/pull/1732#issuecomment -143478944

Apakah react-0.14-support dihapus?

@ovaris Saya digabung menjadi master.

@oliviertassinari kapan akan tersedia di npm?

kapan akan tersedia di npm

Saya tidak tahu kapan kami akan memiliki versi bug gratis. Namun Anda dapat mencoba cabang master dengan npm.

Harus diperbaiki dengan rilis terbaru v0.13.0
Terima kasih evreybody atas bantuan Anda.

@oliviertassinari terima kasih!

Terima kasih!

Adakah Ide jika masalah ini masih akan ada di versi terbaru material-ui? Saya dapat menggunakan sebagian besar komponen kecuali yang menggunakan this.refs.xxx.misalnya jika saya mencoba menggunakan Komponen DatePicker, saya mendapatkan pesan kesalahan "Tidak dapat membaca properti 'tampilkan' dari yang tidak ditentukan" dan tidak ditentukan di sini adalah this.refs.dialogWindow.

Saya bereaksi 0.14.8 dan material-ui 0.14.4 ...

kesalahan yang sama

Sepertinya material-ui tidak berfungsi dengan React 0.14.8 dan 0.14.9 dan itu menyedihkan.
Webpack mengeluarkan banyak komplain aneh di konsol saya. Tidak mengerti apa yang harus dilakukan.

@ topgun743 Anda sangat menyakitkan untuk menggambarkan pekerjaan luar biasa di sini (diberikan secara gratis ) sebagai menyedihkan.

Karena masalah ini dibuka bereaksi 15 dirilis, yang bahan-ui kompatibel dengan. Saya sarankan untuk meningkatkan React di dalam proyek Anda.

Apakah halaman ini membantu?
0 / 5 - 0 peringkat