Saat ini dalam komponen item produk kami di sini di folder komponen, tombol-tombolnya adalah bagian dari komponen, demikian juga
komponen yang dapat disentuh yang dibungkus.
Kami tidak dapat mengubah komponen yang dapat terjamah sebanyak itu karena itu berada di sekitar konten kami di sini
dan itu juga bukan masalah besar karena pada layar admin di sini, saya juga ingin barang-barang itu dapat
disentuh tetapi saya ingin pergi ke layar edit saya di sana. kasus.
Saya juga ingin memiliki dua tombol - satu untuk
mengedit dan satu untuk menghapus tetapi tentu saja keterangan dan tindakan harus berbeda.
Sekarang kita dapat meneruskan teks teks ini di sini sebagai alat peraga dan mengganti nama alat peraga yang kita picu ketika tombol-tombol ditekan
dengan cara yang lebih umum, sehingga kita dapat menggunakannya untuk melihat detail pada layar
ikhtisar produk dan untuk mengedit atau menghapus pada layar produk pengguna. Ada juga cara alternatif untuk menangani
ini.
Jadi untuk satu ketika kita menekan komponen ini secara umum, saya akan mengganti nama ini menjadi pilih untuk memiliki nama yang lebih umum yang
masuk akal dalam array yang lebih luas dari kasus penggunaan dan saya juga
akan mengubah cara kita menerima tombol-tombol ini di sini.
Saya akan memotong mereka dari sini dan sebagai gantinya, menampilkan alat peraga anak-anak di sini yang merupakan alat peraga khusus yang merujuk pada apa
pun yang kami lewati antara label pembuka dan penutup dari komponen kami sendiri. Sekarang dengan itu, saya juga bisa menghilangkan warna impor di
sini dan impor tombol dan sekarang pergi ke tempat-tempat
di mana kita menggunakan item
produk, itu akan menjadi layar ikhtisar produk misalnya.
Di sana kita sekarang harus mengimpor komponen tombol dan pastikan Anda mengimpor
warna Anda, jadi
impor warna dari warna konstanta dan sekarang pergi ke item produk Anda dan mengubahnya dari komponen penutupan sendiri ke
komponen yang telah Anda tutup dan
buka dengan tag komponen sendiri. Di antara tag-tag ini, Anda sekarang dapat menambahkan kembali
dua tombol ini dan sekarang tentu saja, jangan gunakan alat peraga pada detail tampilan dan alat peraga di tambahkan ke keranjang di sini, tetapi sebaliknya,
tambahkan logika Anda di sini karena sekarang kami secara dinamis melewati ini dalam komponen item produk
tetapi karena itu kami dapat melewati tombol yang berbeda tergantung di
mana kami menggunakan komponen item produk itu. Jadi sekarang di sini saya akan menambahkan
handler baru, pilih item handler misalnya yang hanya fungsi yang disimpan dalam konstanta seperti ini dan di sana saya ingin melakukan apa yang saya lakukan sebelumnya pada detail
tampilan, saya akan memotong itu dan menambahkannya di sini
dan saya berharap untuk mendapatkan ID dan judul di sini sebagai argumen sehingga saya dapat meneruskan ID dan judul
di sini seperti ini dan sekarang pilih penangan item adalah apa yang
ingin saya picu di sini pada pilih, ingat bahwa saya menamai ini dalam item produk , yang dapat disentuh ini sekarang diaktifkan
hanya pada pilih, jadi Anda harus mengubah nama ini di tempat-tempat
di mana Anda menggunakan komponen seperti di sini dan kemudian di sini, saya menjalankan penangan item pilih saya di
sini dan meneruskan itemData. barang. id dan itemData. barang. beri judul di
sini sehingga data ini berakhir di fungsi ini. Saya melakukan ini karena sekarang saya dapat menggunakan item
handler yang sama di sini pada tombol view details ini, pada dasarnya saya hanya dapat menyalin fungsi anonim ini dan menambahkannya di
sini ke handler onPress tombol ini, jadi
sekarang kita menggunakannya kembali dan menambahkan ke kereta, baik
di sana kami kirim ini,
ini sekarang dihapus di sini dari komponen item produk karena di sana kita tidak lagi
memiliki prop itu, sebaliknya sekarang di sini, prop ini yang mengambil fungsi anonim ini yang kemudian pada akhirnya harus mengirimkan
tindakan ini.
Jadi sekarang perubahan utama adalah bahwa saya memindahkan tombol dari komponen, dari komponen item produk ke komponen layar gambaran
umum produk dan yang memungkinkan kita untuk tetap melakukan hal yang sama seperti sebelumnya, jika saya simpan
itu, yang seharusnya masih berfungsi seperti sebelum. Kami dapat mengetuk suatu item, kami dapat
mengetuk detail tampilan, kami dapat mengetuk ke troli dan itu semua berfungsi tetapi
sekarang kami juga dapat menyesuaikan ini di layar produk pengguna.
Jadi di sana saya juga akan menyalin tombol-tombol ini dan pergi ke layar produk pengguna dan di sana, tombol impor dari React Native,
impor warna kami konstan karena kami akan membutuhkannya untuk tombol-tombol dari warna konstanta dan kemudian di sini di item produk ,
alih-alih menyiapkan ini, kita perlu mengurai prop pilih pada saat item secara umum disadap tetapi sekarang kita juga menambahkan tag pembuka dan penutup untuk komponen kustom
kita sendiri dan lagi,
tambahkan tombol kita di sini tetapi alih-alih melihat detail,
sekarang Saya katakan edit dan
hapus dan untuk saat ini, saya bisa menghapus semua logika lainnya karena untuk saat ini, kami
tidak memiliki logika untuk mengedit dan menghapus tetapi itu adalah sesuatu
yang dapat kita tambahkan nanti.
Dan di sini untuk pilih, itu juga hanya fungsi kosong untuk saat ini.
Ini memiliki keuntungan bahwa sekarang kami memiliki barang-barang kami seperti yang kami miliki sebelumnya di sini tetapi di bagian admin, kami
sekarang telah mengedit dan menghapus dan
ini memungkinkan kami untuk melakukan hal-hal yang berbeda dengan tetap menggunakan kembali komponen barang produk yang tentu
saja cukup bagus.