Keterangan alat terlihat untuk mengarahkan kursor
Keterangan alat disembunyikan untuk mengarahkan kursor
<Tooltip title="Tooltip" placement="bottom">
<IconButton disabled>
<Done/>
</IconButton>
</Tooltip>
| Teknologi | Versi |
| -------------- | --------- |
| Materi-UI | v1.0.0-beta.12 |
Elemen yang dinonaktifkan tidak akan mengaktifkan peristiwa. Namun Anda dapat menempatkan DIV di atas elemen dan mendengarkan peristiwa yang diaktifkan pada elemen tersebut.
https://stackoverflow.com/questions/18113937/fire-onmouseover-event-when-element-is-disabled
Menerapkan saran ini terlihat seperti ini, dan berhasil.
<Tooltip title="Tooltip" placement="bottom">
<div>
<IconButton disabled>
<Done />
</IconButton>
</div>
</Tooltip>
Saya juga berpikir untuk menggunakan properti component
tetapi tidak berhasil karena gaya pointer-events: none;
:
<Tooltip title="Tooltip" placement="bottom">
<IconButton component="div" disabled>
<Done />
</IconButton>
</Tooltip>
@oliviertassinari Maaf, tidak tahu. Terima kasih.
@bravecow Saya rasa kita bisa menambahkan peringatan jika lebih banyak orang mengangkat masalah ini.
Jadi, apakah solusi yang diterima untuk ini adalah menempatkan div antara tombol dan tooltips? Memiliki tooltip biasanya paling membantu pada tombol yang dinonaktifkan, untuk menunjukkan mengapa tombol tersebut dinonaktifkan.
Bagaimana jika kita menambahkan sebuah prop ke komponen Tooltip
yang menandakannya untuk muncul bahkan ketika anak tersebut dinonaktifkan? Itu hanya akan menerapkan solusi ini di bawah tenda tetapi setidaknya pengguna tidak akan dibiarkan bertanya-tanya mengapa tooltips tidak berfungsi pada tombol yang dinonaktifkan.
Bagaimana Anda mematikan peringatan tooltip?
Bagaimana Anda mematikan peringatan tooltip?
@goyney https://github.com/mui-org/material-ui/issues/8416#issuecomment -332556082
@oliviertassinari Bagaimana cara mematikan peringatan tooltip tanpa mengacaukan DOM?
Saya memiliki beberapa bilah alat tombol yang dinonaktifkan saat konten dimuat. Setiap tombol memiliki keterangan alat di atasnya. Setelah dokumen dimuat, semuanya aktif. Harus membungkus setiap. tunggal. tombol. di span
untuk menekan peringatan ini menjengkelkan.
@ goyney Bagaimana dengan merender Tooltip secara kondisional bila diperlukan? Sejauh yang saya pahami, Anda tidak ingin menampilkan tooltip apa pun saat tombol dinonaktifkan.
Saya selalu ingin menampilkan tooltip. Bagaimana dengan suppressWarnings
prop atau sesuatu di tooltip.
Saya selalu ingin menampilkan tooltip
@ goyney Bahkan saat tombol dinonaktifkan?
Ya, itulah yang saya katakan. lol
Seperti yang saya sebutkan di atas, tooltips sangat berguna bagi pengguna ketika tombol @oliviertassinari dinonaktifkan, untuk menunjukkan kepada mereka mengapa tombol dinonaktifkan.
@ dskoda1 Saya telah membuka # 11601.
Elemen yang dinonaktifkan tidak akan mengaktifkan peristiwa. Namun Anda dapat menempatkan DIV di atas elemen dan mendengarkan peristiwa yang diaktifkan pada elemen tersebut.
https://stackoverflow.com/questions/18113937/fire-onmouseover-event-when-element-is-disabled
Menerapkan saran ini terlihat seperti ini, dan berhasil.
<Tooltip title="Tooltip" placement="bottom"> <div> <IconButton disabled> <Done /> </IconButton> </div> </Tooltip>
Ini membantu dalam menampilkan tooltip pada tombol nonaktif tetapi tombol yang diapit dalam 'div' kehilangan gaya untuk saya. Apa yang kulewatkan di sini?
Komentar yang paling membantu
https://stackoverflow.com/questions/18113937/fire-onmouseover-event-when-element-is-disabled
Menerapkan saran ini terlihat seperti ini, dan berhasil.