Jadi untuk itu seperti yang disebutkan, saya kembali ke proyek yang kami kerjakan dan tentu saja
sekarang layar edit produk di sini
adalah apa yang saya tertarik, ini adalah layar di mana saya memiliki input teks ini di sini dengan label saya
dan kemudian input teks, di mana saat ini kami memiliki
penanganan input yang sangat dasar, kami setidaknya mengambil input pengguna dan menyimpannya dengan bantuan status Bereaksi, dengan menggunakan
status kait,
kami kemudian memasukkan nilai Android kembali ke input dan hanya itu.
Ini memungkinkan kami untuk menangkap dan menggunakan input pengguna tetapi untuk satu, kami dapat meningkatkan cara kami melakukannya, kami dapat menulis
ini dengan cara yang lebih dapat digunakan kembali dan kami tidak melakukan validasi apa pun, jadi
ini adalah hal-hal yang ingin saya ubah dalam modul ini.
Selain itu, kami juga tidak mengonfigurasi input kami dengan cara apa pun, yang
berarti bahwa saat ini semua input teks sama.
Kami tidak mengubah jenis keyboard yang kami
sajikan, kami tidak menawarkan input multiline misalnya untuk teks yang lebih panjang seperti di
sini untuk deskripsi, tidak ada yang terjadi dan karena itu mari kita mulai dengan
mengkonfigurasi input ini sebelum melanjutkan untuk validasi dan sebagainya. Salah satu konfigurasi penting yang dapat Anda tambahkan ke
keyboard Anda adalah jenis keyboard. Jenis keyboard prop dapat diatur dan di sana Anda memiliki beberapa nilai yang tersedia. Sekarang Anda punya cukup banyak nilai
di sini, tetapi dokumen resmi juga merupakan tempat yang harus Anda konsultasikan ketika memikirkan jenis yang ingin Anda
tetapkan di sini karena ketika mengunjungi dokumentasi input teks resmi, Anda tentu saja melihat beberapa contoh tetapi kemudian Anda juga
melihat semua alat peraga yang Anda miliki dan di sana, Anda dapat mempelajari lebih lanjut tentang
masing-masing alat peraga dan bagaimana Anda dapat mengonfigurasinya dan untuk
jenis papan ketik misalnya, kami mengetahui bahwa hanya jenis ini yang didukung lintas platform.
Jadi, sementara kami memiliki jenis iOS dan Android tertentu, jenis ini hanya dapat digunakan bersama dengan pemeriksaan platform
sehingga Anda memastikan Anda tidak
menggunakan jenis di Android yang tidak didukung di sana dan yang karenanya tidak
akan memiliki efek.
Oleh karena itu, saya akan tetap berpegang pada tipe lintas platform, sehingga saya tidak perlu menambahkan pemeriksaan platform tambahan dan di sana, biasanya untuk
katakanlah teks normal, kami akan tetap menggunakan default yang tentu saja karena itu adalah jenis yang kami tidak lakukan. harus
menetapkan tetapi itu misalnya berubah ketika kita melihat input harga kami. Di sana saya ingin memastikan bahwa orang hanya memasukkan angka yang
valid, bahwa mereka tidak memasukkan teks apa pun dan oleh karena itu tentu saja saya ingin menunjukkan keyboard yang tepat untuk membantu
mereka dalam hal ini dan jika kita melihat pada dokumentasi
resmi, kita melihat bahwa ada tiga jenis lintas platform utama dari keyboard yang dapat kami tampilkan
- angka, pad desimal, dan numerik, dan di sana misalnya desimal pad adalah input yang memungkinkan pengguna untuk memasukkan angka desimal yang persis seperti
yang saya inginkan di sini untuk harga saya. Jadi karena itu mengatur jenis keyboard ini di
sini sangat masuk akal karena sekarang jika kita melihat input harga
ini di sini dan saya mengaktifkan soft keyboard yang dapat Anda lakukan dengan pintasan perintah k di sini di iOS
atau dengan menu perangkat keras di sana, kemudian keyboard, matikan perangkat lunak keyboard, Anda melihat bahwa sekarang saya punya keyboard desimal ini membuka di
sini sedangkan pada input lainnya, saya memiliki keyboard teks normal dan tentu saja, itu
sama di Android.
Jika kita pergi ke admin di sana dan kemudian melihat harganya, kita juga melihat bahwa di sana, kita
dihadapkan dengan input ramah angka ini, bukan keyboard teks normal yang kita dapatkan di bidang input lainnya.
Jadi ini adalah bagaimana kita dapat mengkonfigurasi ini dan ini tentu saja merupakan konfigurasi yang penting. Kami juga dapat mengonfigurasi hal-hal lain,
misalnya di sini pada input judul di sini.
Jika Anda menekan ruang kontrol dan Anda melihat pelengkapan otomatis, Anda melihat ada banyak hal yang dapat
Anda konfigurasi, misalnya apakah ini harus dikapitalisasi secara otomatis. Di sana Anda memiliki nilai yang berbeda
yang dapat Anda tetapkan, misalnya karakter yang harus ditulis dengan huruf besar, hanya kalimat atau kata-kata
penuh dan di sini, saya akan menggunakan kalimat lengkap misalnya untuk membantu dengan memanfaatkannya.
Anda juga dapat mengaktifkan koreksi otomatis dan dengan menambahkannya seperti ini, Anda memastikan bahwa koreksi otomatis diaktifkan untuk
input ini, dengan mengaturnya ke false, Anda dapat menonaktifkannya atau dengan hanya menghilangkannya tentu saja,
itu juga merupakan opsi dan seterusnya. . Ada banyak hal yang dapat Anda konfigurasi dan
saya akan sangat menyarankan agar Anda selalu melihat dokumen resmi juga untuk mempelajari tentang opsi konfigurasi yang tersedia
dan apa yang mereka lakukan, juga
hanya bermain-main dengan mereka sehingga Anda mendapatkan ide untuk apa yang dapat Anda lakukan di sana dan apa yang dilakukan
setiap opsi dan apa yang mungkin masuk akal untuk aplikasi Anda berikutnya. Satu nilai lain yang ingin saya tetapkan misalnya
adalah jenis kunci kembali.
Ini dapat diatur ke beberapa nilai dan
lagi jika Anda memeriksa dokumen resmi, Anda akan belajar bahwa tidak semua nilai tersedia di semua
platform, hanya lima ini yang tersedia lintas platform dan di sana, Anda pada dasarnya dapat mengkonfigurasi tombol ini
di bagian bawah pojok kanan. Jika Anda melihat input Anda di
sini dan Anda mengklik salah satu input, tombol ini di sini di sudut kanan bawah yang mengatakan kembali
di sini untuk imageUrl. Sekarang pada judul, saya mengaturnya ke depan, jadi
jika Anda mengklik ke bidang judul, sekarang Anda lihat di sini ia mengatakan lebih luas, yang merupakan bahasa Jerman untuk selanjutnya dan
ini hanya karena saya memiliki emulator Jerman di sini dan biarkan saya juga me-restart ini di Android karena macet di sana sehingga
saya bisa menunjukkannya di sana juga.
Jika kita masuk ke input kita di sana, klik pada judul, Anda melihat tombol selanjutnya di sini,
pada imageUrl, Anda memiliki tombol selesai di sini dan itu dapat dikonfigurasi dengan jenis kunci
kembali, meskipun perlu diketahui bahwa ini hanya mengontrol bagaimana ini ditampilkan, apa yang tertulis di sana, apa label di
sana atau jenis tombol apa yang disajikan,
itu tidak secara otomatis mengubah apa yang dilakukan tombol ini, misalnya jika saya mengklik tombol yang lebih luas,
keyboard ini
tertutup, hal yang sama berlaku jika Saya klik tombol kembali di sini.
Sekarang ketika kita berbicara tentang perilaku input teks, maka semua acara yang dapat kita dengarkan menarik.
Dengan on, Anda mendapatkan gagasan tentang semua acara yang dapat
Anda dengarkan dan misalnya Anda dapatkan di Blur yang menyala setiap kali input kehilangan fokus, onChange akan menyala, sehingga
pada setiap penekanan tombol dan memberi Anda acara input penuh, onChangeText yang juga menyala pada setiap keystroke
tetapi hanya memberi Anda teks yang dimasukkan yang biasanya lebih Anda sukai.
onEndEditing di mana kita juga bisa mendapatkan ide kapan ini menyala, jadi jika saya masuk onEndEditing di sini, mari kita lihat ketika
ini dicetak di konsol, jika
saya sekarang pergi ke sini untuk input saya dan harap dicatat saya pada input judul, jadi jika Saya mengetik tes di sana, kita melihat
itu tidak menyala di sini, jika saya
klik dari ini, sekarang itu dipecat diEndEditing. Hal yang sama berlaku jika saya mengklik tombol yang
lebih luas di sini misalnya, jadi pada dasarnya setiap kali kita meninggalkan keyboard ini dengan fokus atau secara umum ketika kita mengklik tombol
yang dilakukan di sana juga.
Selain itu, kami juga memiliki pendengar lain, seperti onFocus yang jelas menyala ketika input ini mendapatkan fokus
atau juga pada SeleksiChange ketika kami memilih teks di sana atau diSubmit Mengedit yang dipecat ketika tombol kembali ini diklik, jadi jika saya
menambahkan onSubmitEditing di sini, ketika
saya tambahkan pendengar ini juga dan juga tambahkan pernyataan log konsol, Anda melihat bahwa sekarang ini akan menyala, setiap kali saya mengetik di
sini, tidak memecat, setiap kali saya klik dari sini, itu juga tidak menyala, kami hanya mendapatkan onEndEditing login
di sini
tetapi akan menyala jika saya menekan tombol yang lebih luas di sini, di sana Anda melihat onSubmitEditing,
jadi ini adalah pendengar
yang akan Anda gunakan untuk mendengarkan ketika kunci kembali diklik dan kemudian Anda dapat
melakukan apa pun yang ingin Anda lakukan, seperti mengirimkan Anda data atau secara otomatis memindahkan fokus
ke input berikutnya dengan bantuan referensi misalnya jika Anda mau.
Ini adalah bagaimana Anda dapat mengkonfigurasi ini dan seperti yang saya katakan, saya akan merekomendasikan Anda
menyelami ini untuk mendapatkan perasaan bagaimana
ini bekerja, saya sekarang akan pindah namun dan saya ingin memastikan bahwa kami tidak hanya mendengarkan masukan dan
menyimpan nilai tetapi kami juga memvalidasi apa yang dimasukkan pengguna.