Vue2-Simplert - Alternatif SweatAlert untuk Framework VueJS

Vue2-Simplert - Alternatif SweatAlert untuk Framework VueJS

Create: SaldiSaldi | Jumat, 26 Mei 2017 | 17:52:41 WITA | dibaca: 1739

SweatAlert merupakan salah satu library yang populer dan menjadi begitu mainstream untuk digunakan para developer terutama ketika membutuhkan untuk menampilkan suatu informasi atau pesan dalam bentuk popup atau modal. VueJS sendiri adalah framework Javascript yang dibuat oleh Evan You yang setahun belakangan ini menjadi begitu populer dan mulai banyak diadopsi oleh banyak developer dan perusahaan sebagai base javascript framework mereka.

VueJS sendiri sudah mengadopsi konsep component, yang mana juga banyak diadopsi oleh framework javascript terbaru lainnya. Dengan mengadopsi konsep ini kita bisa membuat suatu komponen yang bisa digunakan berulang layaknya library di jQuery. VueJS merupakan framework yang berkembang di komunitas, termasuk juga dengan perkembangan dan ketersediaan berbagai komponen yang berbasiskan VueJS yang makin lama makin banyak dan lengkap seiiring perkembangan komunitasnya. Sebagian besar komponen yang tersedia, kita bisa temukan di salah satu repository yang bernama Awesome-Vue, yang merupakan kumpulan atau daftar dari berbagai komponen dan repositor keren dan berguna berbasiskan VueJS.

Sayangnya memang di beberapa kesempatan kita mungkin tidak bisa menemukan komponen seperti yang kita ingin di VueJS, kalaupun ada biasanya tidak sesuai. Cara yang paling mudah untuk menyelesaikan masalah ini adalah dengan berusaha membuat komponen sendiri dan melemparkannya ke komunitas agar bisa berkembang lebih cepat. Saya sendiri membutuhkan komponen seperti SweatAlert pada waktu itu, dan sayangnya juga tidak dapat menemukan seperti yang saya inginkan. Akhirnya saya putuskan untuk membuat sendiri komponen SweatAlert berbasiskan Vue2 yang saya beri nama Vue2-Simplert

 

Berikut beberapa petunjuk untuk menggunakan Vue2-Simplert :

1.     Untuk mendownload Vue2-Simplert, Anda bisa memanfaatkan npm atau yarn dengan cara : npm install vue2-simplert — save-dev untuk npm dan yarn add vue2-simplert untuk yarn.

2.     Untuk meng-import nya pun cukup mudah, cukup dengan cara berikut :

3.  <script>

4.  import Simplert from 'vue2-simplert'

5.  export default {

6.  components: {Simplert}

7.  };

8.  </script>

9.     Vue2-Simplert menggunakan template yang bisa Anda gunakan seperti berikut :

10. <simplert isUseRadius=true

11.       isUseIcon=true

12.       ref="simplert">

13. </simplert>

14.                        Kemudian untuk membuka Popup Alert tersebut, Anda bisa memanggil method open dengan mengirimkan beberapa parameter yang Anda set sesuai dengan kebutuhan Anda. Berikut contoh memanggil method opentersebut :

15. let obj = {

16.    title: 'Custom Function',

17.    message: 'Click close to trigger custom function',

18.    type: 'info',

19.    colorBtn: '#00b35e',

20.    onClose: this.onClose

21. }

22. this.$refs.simplert.openSimplert(obj)

Mudah bukan ?

Anda bisa menemukan semua dokumentasi penggunaan, method dan props yang tersedia di halaman wiki disini. Anda juga bisa melihat demo dari Vue2-Simplert disini.

Karena repository ini dibuat open-source, maka silahkan fork Vue2-Simplert di github bila Anda menemukan bug atau ada permintaan feature baru.

Terima kasih dan semoga bermanfaat.

 SUMBER : https://www.codepolitan.com/vue2-simplert-alternatif-sweatalert-untuk-framework-vuejs-59279ae22e8ce



59 KOMENTAR

| 29 Juli 2017 || 15:41:19
" You really make it seem really easy with your presentation however I to find this topic to be really something which I feel I would never understand. It seems too complicated and very vast for me. I’m looking ahead in your next submit, I will attempt to get the hang of it! "
wingsio | 15 Agustus 2017 || 14:03:50
" Your article reflects the issue people are concerned about. The article provides timely information that reflects multi-dimensional views from multiple perspectives. I look forward to reading quality articles that contain timely information from you. "
toyota pamulang | 11 September 2017 || 15:24:25
" compatible sama semua pemrogaman berbasis web kah? "
patcher apps download | 11 September 2017 || 15:33:58
" Download Lucky patcher no root apk now. LuckyPatcher Android APK. It is said that 10,000+ users downloaded Lucky Patcher No Root Hack latest version on 9Apps for free every week! It truly does not offer any money. "
Promo Mobil Honda Samarinda Terbaru | 13 September 2017 || 09:48:33
" nice artikel "
harga sewa mobil semarang | 14 September 2017 || 09:48:49
" mantap jiwa "
sewa mobil mercy | 25 September 2017 || 14:47:50
" masih belum paham "
tonsil stones removal | 27 September 2017 || 12:29:48
" Jump to How do you know if you have tonsil stones - tonsil stones are white spots on tonsils ... You can usually determine if you have tonsil stones through ...These are the most common tonsil stones symptoms you should look out for. "
harga toyota bogor | 03 Oktober 2017 || 11:23:38
" kurang jelas gan skripnya, mohon bimbinganya "
reseller baju hijab | 03 Oktober 2017 || 11:48:23
" sip gan membantu banget untuk tugas kelompok ane "
sablon kaos terbaik | 03 Oktober 2017 || 13:54:53
" frame network asinya buat apa sih? "
jemuran otomatis | 03 Oktober 2017 || 14:00:00
" sangat membantu gan thanks "
Obat Aborsi Semarang | 04 Oktober 2017 || 00:14:35
" I love your post here is more information for us thanks for sharing with us. "
remy hair extensions | 10 Oktober 2017 || 08:27:41
" Brown hair of clip in hair extensions the hair "
hammer of thor bandung | 14 Oktober 2017 || 08:35:44
" Much thanks to you a great amount for this and continue sharing. "
nodejs quiz | 25 Oktober 2017 || 11:08:38
" The information you share is very useful. It is closely related to my work and has helped me grow. Thank you! "
Jual Obat Aborsi Ampuh | 02 November 2017 || 02:20:31
" I love your post here is more information for us thanks for sharing with us. "
Obat Tidur | 27 November 2017 || 19:19:19
" cool wah also browse your site , I really like and are excited about this can find your site .. "
titan gel bandung | 28 November 2017 || 07:25:13
" thnaks "
my best buy | 08 Desember 2017 || 22:50:07
" They can use their home computer or smart phone to access the site "
| 19 Desember 2017 || 20:23:10
" "
Obat Aborsi | 20 Desember 2017 || 11:20:40
" perlu dicoba yaa.. "
Transfer Antar Bank | 21 Desember 2017 || 17:31:09
" Baru baca soal ini di Medium, overall ini frontend yang lumayan disukai juga ya, gak kalah terkenal juga. Penggunaannya juga sudah lumayan banyak, apalagi diaplikasikan. BTW plugin ini apakah memperberat load speed Vue? "
Sewa Mobil Surabaya | 04 Januari 2018 || 20:30:26
" Saya membaca beberapa kali artikel ini dan saya pikir bahwa artikel Anda adalah nyata dan menarik juga merupakan informasi yang baik. Apa yang anda lakukan adalah hal yang Luar biasa dan saya sangat menghargai. Terima kasih "
word cookies answersaz | 08 Januari 2018 || 13:17:50
" The article provides timely information that reflects multi-dimensional views. THanks alot "
Obat Kuat | 12 Januari 2018 || 06:45:27
" thanks you infona "
gmail login | 15 Januari 2018 || 11:02:23
" This is a great article. I like this theme. This site has a lot of advantages. "
Voyance par téléphone sans CB | 16 Januari 2018 || 18:21:47
" Incredible post I might want to thank you for the endeavors you have made in composing this fascinating and learned article. "
Yahoo mail sign up | 25 Januari 2018 || 15:12:46
" Alternatif SweatAlert untuk Framework VueJS "
Yahoo mail sign up | 25 Januari 2018 || 15:13:01
" Alternatif SweatAlert untuk Framework VueJS "
mangafox | 13 Februari 2018 || 14:05:24
" You really make it seem really easy with your presentation however I to find this topic to be really something which I feel I would never understand. It seems too complicated and very vast for me. I’m looking ahead in your next submit, I will attempt to get the hang of it! "
hooda | 12 Maret 2018 || 16:56:25
" This is extremely helpful info!! Very good work. Everything is very interesting to learn and easy to understood. Thank you for giving information. "
Putlocker | 19 Maret 2018 || 16:06:37
" Nice post. I appreciate the tips. My training routine is remarkably similar to yours, although I expect I'm slogging along much more slowly than you "
whatsapp web | 28 Maret 2018 || 12:36:08
" whatsapp web WhatsApp online is high due to the increase in the number of smartphones/ Laptop/ PC devices "
jual obat aborsi | 16 April 2018 || 16:26:11
" [url=http://aborsi-tuntas.com]Jual Obat Aborsi[/url] [url=http://klinikaborsigaransi.com]Obat Aborsi Manjur[/url] <a href="http://aborsi-tuntas.com/">Jual Obat Aborsi</a> , <a href="http://klinikaborsigaransi.com/">Obat Aborsi Manjur</a> , Hub / WA : 08 222 5555 602 "
hotmail entrar | 07 Mei 2018 || 15:41:44
" I was a girl, but clumsy things. I do not know how to cook, sew, above, ca. I have too insipid and tedious, but that's my personality. It's hard to change "
fireboy and watergirl | 08 Mei 2018 || 15:51:48
" This is the most impressive article on your site, thanks for constantly working on replenishing the material "
hotmail sign in | 18 Mei 2018 || 16:29:21
" Back in July 2012, Microsoft launched Outlook.com webmail service with an intention to replace its Hotmail with a modern email service. The fresh UI, best in class anti-spam engine, and smart options to organize the inbox easily make Outlook.com the best Microsoft webmail service yet. "
windows product key | 19 Mei 2018 || 14:21:10
" We confidence from above article you acquire a vision what is windows 7 product key. This is the furthermost significant instrument for you to initiate windows 7 on your PC. There are some trail windows 7 key is similarly available online which can be used for a trial version of Windows 7, but as Windows 7 is now commercially owned by Microsoft those keys would not be able to effort properly and you have to purchase your original windows to get your windows 7 up and execute. With original windows, you will continuously get sufficient support from Microsoft to execute your application and they will make sure that you are not fronting any issue about windows 7 key or any other execution issue. "
indonesia house for sale | 25 Mei 2018 || 17:01:15
" Terima kasih, artikelnya bermanfaat. Saya tunggu update terbarunya ya. Terima kasih "
torrents | 05 Juni 2018 || 13:31:40
" SweatAlert is nice libraries with huge information to explore. I really like it "
hotmail account | 06 Juni 2018 || 16:05:51
" I really love reading your blog. I also found your post very interesting. In fact after reading, I had to give it to my friend and he was also excited! "
hotmail account | 06 Juni 2018 || 16:06:04
" I really love reading your blog. I also found your post very interesting. In fact after reading, I had to give it to my friend and he was also excited! "
hotmail account | 06 Juni 2018 || 16:06:22
" I really love reading your blog. I also found your post very interesting. In fact after reading, I had to give it to my friend and he was also excited! "
bouncing balls | 22 Juni 2018 || 14:43:08
" I have too insipid and tedious, but that's my personality. It's hard to change "
bouncing balls | 22 Juni 2018 || 14:43:19
" I have too insipid and tedious, but that's my personality. It's hard to change "
Outlook Entrar | 27 Juni 2018 || 11:24:14
" Today the weather is quite beautiful. I like this. It makes me comfortable and works better. But I tried my best and try to finish the contest with a fierce determination to live up to the expectations of people. "
html color picker | 05 Juli 2018 || 10:22:33
" I really love reading your blog. I also found your post very interesting. In fact after reading, I had to give it to my friend and he was also excited! "
Obat Aborsi | 08 Juli 2018 || 13:17:25
" http://jual-penggugurkandungan.com/ Obat Aborsi Penggugur Kandungan https://jual-penggugurkandungan.com/obat- aborsi-semarang/ https://jual-penggugurkandungan.com/o bat-aborsi-surabaya/ https://jual-penggugurkandungan.c om/obat-aborsi-bekasi/ https://jual-penggugurkandungan .com/obat-aborsi-jakarta/ https://jual-penggugurkandun gan.com/obat-aborsi-batam/ https://jual-penggugurkandu ngan.com/obat-aborsi-bandung/ https://jual-penggugurka ndungan.com/obat-aborsi-bogor/ https://jual-penggugurk andungan.com/obat-aborsi-jogja/ https://jual-penggugur kandungan.com/obat-aborsi-magelang/ http://jualoba taborsimanjur.com/ jual obat aborsi http://obataborsi-manjur.com/ obat aborsi http://klinikaborsijanin.com/ klinik aborsi tuntas http://klinikaborsigaransi.com/ obat aborsi manjur http://obataborsi99.net/ jual obat aborsi asli http://obat-aborsi-aman.com/ obat aborsi aman http://aborsi-tuntas.com/ jual obat aborsi ampuh "
color switch | 18 Juli 2018 || 13:35:36
" In fact after reading, I had to give it to my friend and he was also excited! "
jual obat aborsi surabaya | 20 Juli 2018 || 14:46:32
" https://klinikmedical.com/jual-obat-aborsi-surabaya/ "
jual obat aborsi jakarta | 20 Juli 2018 || 14:47:38
" https://klinikmedical.com/jual-obat-aborsi-jakarta/ "
jual obat aborsi malang | 20 Juli 2018 || 14:48:35
" https://klinikmedical.com/jual-obat-aborsi-malang/ "
net worth | 28 Juli 2018 || 15:06:09
" You really make it seem really easy with your presentation however I to find this topic to be really something which I feel I would never understand. It seems too complicated and very vast for me "
run 3 | 06 Agustus 2018 || 09:24:15
" Your Vue2-Simplert manual is very helpful to me. It helps my work a lot. I appreciate your article. "
run 3 | 06 Agustus 2018 || 09:24:38
" Your Vue2-Simplert manual is very helpful to me. It helps my work a lot. I appreciate your article. "
harga Genset 27,5 kVa di Bali | 08 Agustus 2018 || 09:43:43
" pertamax gan terimakasih untuk infonya "
Jual Cytotec Asli | 09 Agustus 2018 || 11:25:56
" <a href="http://jualpilcytotecasli.com">http://j ualpilcytotecasli.com</a> , <a href="http://jualpilcytotecasli.com">Jual Cytotec Asli</a> , <a href="http://jualpilcytotecasli.com/tiga-cara-menggug urkan-kandungan-pill-cytotec-misoprostol/">http:/ /jualpilcytotecasli.com/tiga-cara-menggugurkan-kandungan- pill-cytotec-misoprostol/</a> , <a href="http://jualpilcytotecasli.com/jual-obat-penggug ur-kandungan-paling-manjur/">http://jualpilcytote casli.com/jual-obat-penggugur-kandungan-paling-manjur/< ;/a> , <a href="https://jualobat-aborsi.com/">Jual Obat Aborsi</a> , <a href="https://jualobat-aborsi.com/">Obat Penggugur Kandungan</a> , <a href="http://jualobataborsimanjur.com/jual-obat-pelan car-haid/">http://jualobataborsimanjur.com/jual-o bat-pelancar-haid/</a> , <a href="http://jualobataborsimanjur.com/jual-obat-telat -bulan/">http://jualobataborsimanjur.com/jual-oba t-telat-bulan/</a> , "
obat aborsi asli | 15 Agustus 2018 || 03:28:58
" Jual OBAT ABORSI 082133482133 - Obat Aborsi Asli, Obat Cytotec, Obat Penggugur Kandungan, Obat Pelancar Haid, Obat Aborsi Misoprostol, Jual Obat Cytotec.Obat aborsi Bergaransi Bersih tuntas https://www.klinik-chionghua.com/ htt ps://www.aborsipenggugur.com/ https://obatpenggugu r-kandungan.com/ http://obatcytotecimport.com/ http://cytotecmanjur.com/ https://aborsicepat. com/ <a href="https://aborsipenggugur.com/" rel="nofollow">Obat Aborsi Tuntas</a> <a href="https://aborsicepat.com/" rel="nofollow">Obat Aborsi</a> <a href="http://cytotecmanjur.com/" rel="nofollow">Obat Aborsi Asli</a> <a href="https://klinik-chionghua.com/" rel="nofollow">Obat Aborsi Manjur</a> <a href="http://cytotecmanjur.com/" rel="nofollow">Obat Aborsi Ampuh</a> <a href="https://klinik-chionghua.com/" rel="nofollow">Obat Aborsi aman</a> <a href="http://obatcytotecimport.com/" rel="nofollow"> Jual Obat Aborsi</a> <a href="http://cytotecmanjur.com/" rel="nofollow"> Jual Obat Aborsi tuntas</a> <a href="http://obatcytotecimport.com/" rel="nofollow"> Jual Obat Aborsi Asli</a> <a href="https://klinik-chionghua.com/" rel="nofollow"> Jual Obat Aborsi Manjur</a> <a href="https://aborsicepat.com/" rel="nofollow"> Jual Obat Aborsi Ampuh</a> <a href="http://obatcytotecimport.com/" rel="nofollow"> Jual Obat Aborsi Aman</a> <a href="http://obatpenggugur-kandungan.com/" rel="nofollow"> Obat Penggugur Kandungan</a> <a href="http://obatpenggugur-kandungan.com/" rel="nofollow"> Jual Obat Penggugur Kandungan</a> <a href="http://cytotecmanjur.com/" rel="nofollow"> Obat Cytotec</a> <a href="http://obatcytotecimport.com/" rel="nofollow"> Obat Cytotec Tuntas</a> <a href="https://klinik-chionghua.com/" rel="nofollow"> Obat Cytotec Asli</a> <a href="http://cytotecmanjur.com/" rel="nofollow"> Jual Obat Cytotec</a> <a href="http://obatcytotecimport.com/" rel="nofollow"> Jual Obat Cytotec Asli</a> <a href="http://obatpenggugur-kandungan.com/" rel="nofollow"> Jual Obat aborsi Untuk Janin Kuat</a> <a href="https://klinik-chionghua.com/" rel="nofollow">Obat Aborsi Tuntas</a> <a href="http://obatcytotecimport.com/" rel="nofollow">Obat Aborsi</a> <a href="https://aborsipenggugur.com/" rel="nofollow">Obat Aborsi Asli</a> <a href="http://obatcytotecimport.com/" rel="nofollow">Obat Aborsi Manjur</a> <a href="https://klinik-chionghua.com/" rel="nofollow">Obat Aborsi Ampuh</a> <a href="https://aborsipenggugur.com" rel="nofollow">Obat Aborsi aman</a> <a href="http://obatpenggugur-kandungan.com/" rel="nofollow"> Jual Obat Aborsi</a> <a href="https://aborsipenggugur.com" rel="nofollow"> Jual Obat Aborsi tuntas</a> <a href="http://obatpenggugur-kandungan.com/" rel="nofollow"> Jual Obat Aborsi Asli</a> <a href="https://aborsipenggugur.com" rel="nofollow"> Jual Obat Aborsi Manjur</a> "



ISI KOMENTAR

NAMA

WEBSITE

KOMENTAR


Captcha Sepakbola
Apakah anda manusia?Lebih baik lagi kalau anda menyukai sepak bola
Sebutkan pemain sepak bola disamping:

Captcha Sepakbola by codingwear








  • $DCC = NEW XXI("Solidaritas","Loyalitas","Kualitas");
  • PELATIHAN KAMPUS
  • Pelatihan Komputer (DIGITAL SCHOOL)
  • Study Tour GoTv
  • IT FUN