Pemberitahuan Toast adalah komunikator yang berdiam diri tetapi memberi kesan yang memberitahu pengguna anda apa yang berlaku -tanpa melampaui sambutan mereka.
Sama ada anda meraikan operasi yang berjaya atau menunjukkan mesej ralat yang mesra, toasts adalah penyelesaian anda.
Inilah melihat beberapa perpustakaan JavaScript yang popular yang membuat pelaksanaan toasts angin, disusun oleh kegemaran pengguna (bintang).
4. Toastify.js
GitHub Stars: 2.3K
tentang: Perpustakaan JavaScript Pure untuk mesej pemberitahuan yang lebih baik.
Kenapa hebat: Jika anda semua tentang kesederhanaan dan menjaga perkara cahaya, Toastify.js adalah pilihan bintang.
Tanpa kebergantungan mewah atau persediaan yang kompleks, ia sesuai untuk pemaju yang menginginkan penyelesaian yang elegan tanpa kembung tambahan.
Ciri -ciri:
minimal dan lurus.
mudah menambah kecerunan atau imej latar belakang ke roti bakar anda.
Pemberitahuan kedudukan di mana sahaja di skrin.
menyokong tindakan seperti pautan yang boleh diklik.
?
Bermula:
Toastify.js Demo
Apvarun
/
Toastify-JS
Perpustakaan JavaScript tulen untuk mesej pemberitahuan yang lebih baik
Toastify
Toastify adalah perpustakaan pemberitahuan toast vanila JS yang ringan.
Demo
Klik di sini
Ciri -ciri
Pelbagai pemberitahuan yang disusun
disesuaikan
tidak menyekat benang pelaksanaan
Pilihan penyesuaian
Teks Pemberitahuan
durasi
warna latar belakang toast
Paparan ikon Tutup
kedudukan paparan
kedudukan mengimbangi
Pemasangan
Toastify sekarang menyokong pemasangan melalui Oast Top: Wira Pemberitahuan Pengguna Unsung
Jalankan arahan di bawah untuk menambah Toastify-JS ke projek sedia ada atau baru anda.
Oast Top: Wira Pemberitahuan Pengguna Unsung install --save Oast Top: Wira Pemberitahuan Pengguna Unsung
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
atau
yarn add Oast Top: Wira Pemberitahuan Pengguna Unsung -S
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
import Toastify-Js ke dalam modul anda untuk mula menggunakannya.
anda boleh menggunakan CSS lalai dari Toastify seperti di bawah dan kemudian menimpa atau memilih untuk menulis CSS anda sendiri.
import Toastify from 'Oast Top: Wira Pemberitahuan Pengguna Unsung'
Salin selepas log masuk
Salin selepas log masuk
Menambah ToastifyJs ke halaman HTML menggunakan kaedah tradisional
import "Oast Top: Wira Pemberitahuan Pengguna Unsung/src/toastify.css"
Kenapa hebat: dibina khusus untuk React, perpustakaan ini menyampaikan pemberitahuan panas, disesuaikan, dan ringan yang menggabungkan dengan lancar dengan aplikasi React anda.
Ciri -ciri:
? Panas secara lalai.
? Janji API untuk pemuat automatik berdasarkan janji.
? Mudah disesuaikan.
? Ringan -kurang daripada 5kb (termasuk gaya).
?
Bermula:
React Hot Toast Demo
Timolin
/
React-panas-toast
Pemberitahuan React Hot Hot?
Pemberitahuan panas merokok untuk bertindak balas.
ringan, disesuaikan dan cantik secara lalai.
Laman web
·
Dokumentasi
·
Twitter
dimasak oleh timo lins? ?
Ciri -ciri
? panas secara lalai
? mudah disesuaikan
⏳
Janji Api - loader automatik dari janji
?
ringan - kurang daripada 5kb termasuk Styles
✅
boleh diakses
?
cangkuk tanpa kepala - buat sendiri dengan usetoaster ()
Pemasangan
dengan pOast Top: Wira Pemberitahuan Pengguna Unsung
Oast Top: Wira Pemberitahuan Pengguna Unsung install --save Oast Top: Wira Pemberitahuan Pengguna Unsung
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
dengan Oast Top: Wira Pemberitahuan Pengguna Unsung
yarn add Oast Top: Wira Pemberitahuan Pengguna Unsung -S
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Bermula
Tambah pembakar roti ke aplikasi anda terlebih dahulu. Ia akan menjaga semua pemberitahuan yang dipancarkan. Sekarang anda boleh mencetuskan roti bakar () dari mana sahaja!
Oast Top: Wira Pemberitahuan Pengguna Unsung install --save Oast Top: Wira Pemberitahuan Pengguna Unsung
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
...
Lihat pada GitHub
2.
toastr
GitHub Stars: 12k
tentang: pemberitahuan roti bakar JavaScript mudah.
Kenapa hebat: Toastr telah wujud selama bertahun -tahun dan terkenal dengan pilihan penyesuaian yang mantap.
Jika anda memerlukan fleksibiliti dan konfigurasi yang tinggi, Toastr adalah kawan terbaik anda.
Ciri -ciri:
menyokong pilihan penyesuaian yang luas untuk warna, animasi, dan kedudukan.
API yang sangat fleksibel.
Bekerja dengan vanila javascript dan kerangka seperti jQuery.
?
Bermula:
Toastr Demo
CODESEVEN
/
toastr
Pemberitahuan roti bakar JavaScript sederhana
toastr
Toastr
adalah perpustakaan JavaScript untuk pemberitahuan yang tidak menyekat. JQuery diperlukan. Matlamatnya adalah untuk mewujudkan perpustakaan teras mudah yang boleh disesuaikan dan dilanjutkan.
Ujian penyemak imbas yang disediakan oleh BrowserStack.
Versi semasa
2.1.4
Demo
Demo boleh didapati di http://codeseven.github.io/toastr/demo.html
Demo Menggunakan Ikon Fontawesome dengan Toastr
cdns
Toastr dihoskan di CDNJS dan JSDELIVR
debug
// Oast Top: Wira Pemberitahuan Pengguna Unsung.cloudflare.com/ajax/libs/toastr.js/latest/toastr.css
Minified
// Oast Top: Wira Pemberitahuan Pengguna Unsung.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js
// Oast Top: Wira Pemberitahuan Pengguna Unsung.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css
Pasang
Galeri Nuget
Oast Top: Wira Pemberitahuan Pengguna Unsung install --save Oast Top: Wira Pemberitahuan Pengguna Unsung
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Bower
yarn add Oast Top: Wira Pemberitahuan Pengguna Unsung -S
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Oast Top: Wira Pemberitahuan Pengguna Unsung
benang
import Toastify from 'Oast Top: Wira Pemberitahuan Pengguna Unsung'
Salin selepas log masuk
Salin selepas log masuk
Ruby on Rails
import "Oast Top: Wira Pemberitahuan Pengguna Unsung/src/toastify.css"
pOast Top: Wira Pemberitahuan Pengguna Unsung add react-hot-toast
Salin selepas log masuk
wiki termasuk log perubahan
Memecahkan perubahan
perubahan animasi
Pilihan animasi berikut telah ditolak dan harus diganti:
Ganti option.fadein dengan option.showduration
Ganti option.onfadein dengan options.onshown
Ganti option.fadeout dengan option.Hideduration
Ganti option.onfadeout dengan options.onHidden
permulaan cepat
3 Langkah Mudah
untuk panggilan API lain, lihat demo ...
Lihat pada GitHub
1. React Toastify
GitHub Stars: 13k
tentang: sangat disesuaikan dan disayangi oleh banyak orang.
Kenapa hebat: React Toastify mengambil mahkota untuk memudahkan penggunaan dan reka bentuk keanggunan.
Menyediakan pemberitahuan mengambil masa kurang dari 10 saat, menjadikannya kegemaran pemaju.
Ciri -ciri:
sangat mudah disesuaikan.
sokongan RTL untuk aplikasi berbilang bahasa.
fungsi swipe-to-close (dengan arahan yang disesuaikan).
datang cantik secara lalai tetapi membolehkan pilihan gaya yang luas.
?
Bermula:
React Toastify Demo
Fkhadra
/
React-Toastify
Pemberitahuan React Mudah? !
React-toStify
? React-toStify membolehkan anda menambah pemberitahuan ke aplikasi anda dengan mudah.
Pemasangan
Oast Top: Wira Pemberitahuan Pengguna Unsung install --save Oast Top: Wira Pemberitahuan Pengguna Unsung
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Masukkan mod penuh skrin
yarn add Oast Top: Wira Pemberitahuan Pengguna Unsung -S
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Dokumentasi
periksa dokumentasi untuk memulakan anda!
Ciri -ciri
Mudah ditubuhkan untuk sebenar, anda boleh membuatnya berfungsi dalam masa kurang dari 10sec!
super mudah untuk menyesuaikan
sokongan RTL
sapu untuk menutup?
boleh memilih Arah Swipe
Super mudah menggunakan animasi pilihan anda. Bekerja dengan baik dengan animate.css misalnya
boleh memaparkan komponen reaksi di dalam roti bakar!
mempunyai cangkuk onopen dan onclose. Kedua -duanya boleh mengakses ...
Lihat pada GitHub
Pemikiran terakhir
Sama ada anda sedang mencari kesederhanaan atau mencari ciri -ciri canggih, ada perpustakaan roti bakar di luar sana untuk anda:
Pastikan ia mudah? Pergi untuk toastify.js.
reaksi peminat? Cuba React Hot Toast atau React Toastify.
penyesuaian raja? Lihat toastr.
Apa perpustakaan roti bakar kegemaran anda? Kongsi pendapat anda (dan mungkin kisah kejayaan yang layak dibakar) dalam komen di bawah!
Saya telah bekerja pada alat super-convenient yang dipanggil Liveapi.
Liveapi membantu anda mendapatkan semua API backend anda didokumenkan dalam beberapa minit
Dengan LiveAPI, anda dapat dengan cepat menghasilkan dokumentasi API interaktif yang membolehkan pengguna melaksanakan API secara langsung dari penyemak imbas.
Jika anda bosan dengan membuat dokumen secara manual untuk API anda, alat ini mungkin menjadikan hidup anda lebih mudah.
Atas ialah kandungan terperinci Oast Top: Wira Pemberitahuan Pengguna Unsung. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn