1 00:00:02,380 --> 00:00:04,460 Sekarang untuk memvalidasi apa yang dimasukkan 2 00:00:04,480 --> 00:00:07,680 pengguna, saya tentu saja ingin melakukan sesuatu pada setiap penekanan tombol. 3 00:00:07,690 --> 00:00:11,740 Sekarang kita sudah mendapatkan diChangeText di sini sebagai pendengar pada judul misalnya dan 4 00:00:11,740 --> 00:00:15,700 apa yang kita lakukan sekarang adalah kita mengatur judul di negara kita. 5 00:00:15,790 --> 00:00:18,700 Sekarang langkah selanjutnya adalah tidak hanya melakukan 6 00:00:18,700 --> 00:00:25,270 itu, jadi untuk tidak hanya menyimpan input tetapi juga memvalidasi dan juga mengelola jenis validitas input 7 00:00:25,510 --> 00:00:26,780 ini dalam keadaan. 8 00:00:26,860 --> 00:00:36,620 Jadi oleh karena itu, saya akan menambahkan fungsi baru di sini, misalnya handler perubahan judul yang mendapat teks yang dimasukkan dan kemudian dapat melakukan sesuatu dan saya hanya 9 00:00:36,620 --> 00:00:41,870 akan mengalihdayakan ini ke fungsi bernama terpisah untuk memiliki sedikit pembersih, lebih mudah untuk 10 00:00:41,870 --> 00:00:48,830 mengikuti sepanjang kode karena sekarang saya akan mengikat pendengar ini di sini untuk acara onChangeText saya, sehingga fungsi ini menyala 11 00:00:48,830 --> 00:00:55,610 untuk setiap penekanan tombol dan tentu saja, saya masih akan mengatur judul saya dengan teks tetapi sekarang sebagai tambahan 12 00:00:55,610 --> 00:00:56,290 seperti 13 00:00:56,300 --> 00:01:00,220 yang saya katakan, saya juga ingin mengelola validitas dan untuk itu 14 00:01:00,230 --> 00:01:03,590 kita dapat menambahkan status lain yang ingin kita kelola. 15 00:01:03,590 --> 00:01:10,580 Jadi mungkin di sini setelah mengelola nilai judul, kita juga dapat memiliki judul itu keadaan valid atau apa 16 00:01:10,580 --> 00:01:16,100 pun yang Anda ingin menyebutnya dan menambahkan judul set valid di sini sebagai fungsi setter 17 00:01:16,280 --> 00:01:18,780 dan kemudian keadaan ini di sini 18 00:01:18,800 --> 00:01:27,000 awalnya bisa salah sehingga kami awalnya memperlakukan ini tidak valid. Sekarang untuk setiap penekanan tombol di sini di penangan perubahan judul, sebelum 19 00:01:27,630 --> 00:01:33,180 kami dapat menyimpan ini dan memperbarui status judul kami, kami dapat memvalidasi ini tentu saja dan sekarang 20 00:01:33,210 --> 00:01:36,320 sepenuhnya terserah Anda bagaimana Anda ingin memvalidasi ini. 21 00:01:36,390 --> 00:01:45,130 Sekarang misalnya, Anda bisa mengatakan ini hanya valid jika Anda memiliki teks yang tidak kosong, jadi jika panjang teks lebih 22 00:01:45,130 --> 00:01:47,990 besar dari nol. Teks adalah string 23 00:01:48,000 --> 00:01:51,650 tentu saja, jadi jika panjangnya nol, maka ini berarti string kosong. 24 00:01:51,660 --> 00:01:58,920 Kami juga dapat memanggil teks. trim untuk memangkas kelebihan spasi putih sehingga hanya sekelompok spasi kosong 25 00:01:58,920 --> 00:02:00,630 juga tidak diperlakukan sebagai valid. 26 00:02:00,660 --> 00:02:05,760 Tentu saja, Anda juga dapat menambahkan validasi min atau max panjang dengan memeriksa panjangnya di sini, Anda 27 00:02:05,790 --> 00:02:10,420 dapat menambahkan validasi ekspresi reguler untuk memeriksa teks untuk pola tertentu dan itu sebenarnya sesuatu 28 00:02:10,440 --> 00:02:12,820 yang akan kami lakukan nanti juga tetapi 29 00:02:13,170 --> 00:02:15,620 untuk memulai, saya akan cukup periksa seperti ini 30 00:02:16,110 --> 00:02:19,490 dan sekarang di sini jika kita lebih besar dari nol, kita 31 00:02:19,500 --> 00:02:23,550 baik-baik saja tetapi sebenarnya jika kita memiliki panjang nol, kita tidak baik-baik saja. 32 00:02:23,550 --> 00:02:25,100 Jadi di sini saya 33 00:02:25,320 --> 00:02:30,870 ingin menetapkan judul valid ke false, kalau tidak kita tetapkan judul set valid ke true 34 00:02:30,880 --> 00:02:31,810 tentu 35 00:02:31,810 --> 00:02:34,810 saja, jadi jika kita memang memiliki input yang 36 00:02:34,810 --> 00:02:40,420 valid dan kita akan selalu mengatur judul itu sendiri, kita selalu perlu menyimpannya, kita jangan 37 00:02:40,420 --> 00:02:42,580 pernah kehilangan input pengguna itu jika 38 00:02:42,580 --> 00:02:44,410 tidak kita hancurkan aplikasi. 39 00:02:44,410 --> 00:02:50,890 Dan sekarang dengan validitas judul yang disimpan di negara bagian, kita dapat menggunakannya tentu saja di sini di kode JSX 40 00:02:50,890 --> 00:02:56,980 kita untuk memeriksa apakah judul tersebut tidak valid misalnya dan jika itu masalahnya, kita dapat secara dinamis menampilkan 41 00:02:56,980 --> 00:03:04,000 teks di sini di mana kita misalnya mengatakan silakan masukkan judul yang valid untuk menampilkan sedikit pesan kesalahan di sini yang 42 00:03:04,000 --> 00:03:06,670 tentu saja Anda dapat menetapkan beberapa gaya. 43 00:03:06,700 --> 00:03:11,530 Sekarang dengan yang Anda lihat bahwa jika kita masuk ke input kami di sini, kami melihat bahwa 44 00:03:11,560 --> 00:03:15,900 pesan kesalahan langsung dari awal karena kita mulai dalam keadaan tidak valid dan jika 45 00:03:15,910 --> 00:03:22,330 kita mulai mengetik, ini menghilang tetapi jika saya menghapus semua input, itu muncul kembali dan ini adalah beberapa validasi dasar yang dapat 46 00:03:22,390 --> 00:03:27,910 Anda tambahkan untuk menampilkan sedikit pesan kesalahan atau sedikit petunjuk kepada pengguna Anda, untuk memastikan bahwa pengguna mendapatkan setidaknya 47 00:03:27,910 --> 00:03:29,790 ide jenis input yang Anda inginkan. 48 00:03:29,800 --> 00:03:36,700 Sekarang tentu saja, Anda tidak hanya dapat menggunakan validitas ini untuk menampilkan pesan kesalahan tetapi juga untuk menghindari 49 00:03:36,700 --> 00:03:39,780 agar formulir Anda dikirimkan jika itu tidak valid. 50 00:03:39,820 --> 00:03:47,230 Jadi di sini, di dalam penangan kirim, di mana saya selalu mengirimkan data saya dan membuat atau memperbarui suatu produk tidak peduli apakah 51 00:03:47,230 --> 00:03:51,190 input itu valid, di sana kita dapat menggunakan data validitas yang kami 52 00:03:51,190 --> 00:03:56,530 kumpulkan dan misalnya memeriksa apakah judul itu valid dan jika tidak valid, maka tanda seru, maka kita 53 00:03:56,550 --> 00:03:58,000 hanya kembali yang berarti kita 54 00:03:58,060 --> 00:03:59,500 membatalkan eksekusi fungsi 55 00:03:59,500 --> 00:04:04,770 dan kode setelah itu tidak akan berjalan dan selain itu kita mungkin tidak hanya ingin kembali, 56 00:04:04,850 --> 00:04:07,490 tentu saja kita juga dapat mengimpor peringatan dari 57 00:04:07,510 --> 00:04:13,630 React Native dan melempar peringatan asli yang bagus di sini. Jadi kita bisa dengan mudah menunjukkan peringatan 58 00:04:13,630 --> 00:04:24,520 dengan pesan input salah atau judul itu dan pesan tolong periksa kesalahan dalam formulir dan kemudian cukup tambahkan satu tombol di sana di mana 59 00:04:25,090 --> 00:04:32,620 kita mengatakan oke karena tidak ada lagi yang harus dilakukan untuk mengonfirmasi, ya dengan itu kami memiliki 60 00:04:32,620 --> 00:04:33,870 aliran yang 61 00:04:34,180 --> 00:04:39,760 bagus di sini di mana kami memperingatkan pengguna bahwa input tidak valid. 62 00:04:39,760 --> 00:04:45,570 Jadi misalnya sekarang jika saya mencoba mengirimkan input ini dengan judul saya yang tidak valid, saya mendapatkan kesalahan ini dan 63 00:04:45,580 --> 00:04:51,250 hanya jika saya memasukkan judul yang valid, saya dapat mengirimkannya karena saya belum menambahkan validasi untuk input lain 64 00:04:51,250 --> 00:04:53,140 yang tentu saja harus kita . 65 00:04:53,140 --> 00:04:56,410 Jadi ini adalah betapa mudahnya Anda memulai dengan validasi. 66 00:04:56,440 --> 00:05:02,260 Sekarang karena kami menggunakan Javascript di sini, Anda tentu saja dapat juga membawa pustaka validasi pihak ketiga lainnya, seperti 67 00:05:02,950 --> 00:05:09,250 misalnya ValidateJS yang merupakan paket yang dapat Anda instal ke proyek Anda dan mulai menggunakannya untuk kemudian dengan mudah memvalidasi 68 00:05:09,250 --> 00:05:15,310 string untuk pola tertentu jika Anda mau untuk melakukannya. Dalam modul ini, saya akan menulis pola 69 00:05:15,310 --> 00:05:15,900 dasar 70 00:05:15,910 --> 00:05:21,760 yang kami gunakan secara manual sehingga Anda mendapatkan pemahaman yang jelas tentang apa yang sebenarnya 71 00:05:21,790 --> 00:05:26,370 terjadi di sana tetapi Anda benar-benar dapat membawa perpustakaan pihak ketiga juga. 72 00:05:26,380 --> 00:05:31,850 Nah dan sekarang dengan pemahaman dasar tentang validasi dan sebagainya, mari pastikan bahwa 73 00:05:31,990 --> 00:05:38,530 kita sekarang benar-benar juga bergerak menuju bentuk dan manajemen input yang lebih terukur dan tidak melibatkan 74 00:05:38,620 --> 00:05:42,550 banyak negara yang harus kita kelola secara manual.