Jadi sekarang dengan komponen item produk ditata ulang, sekarang saatnya untuk katakan saja menghapus item karena
itu sebenarnya di antara hal-hal paling sederhana yang dapat kita lakukan.
Ini membawa kita kembali ke Redux dan di sana, sekarang saatnya untuk bekerja pada produk dan
saya akan mulai dalam
tindakan yang saat ini merupakan file kosong, produk. File js di folder tindakan di
mana saya ingin mengekspor tindakan yang membantu kami menghapus produk. Oleh karena itu pengidentifikasi hanya bernama hapus produk dan
memegang teks hapus produk di sini dan saya juga akan mengekspor produk penghapusan pembuat tindakan yang mengambil ID produk, seperti ini dan yang kemudian mengembalikan
objek tindakan di mana jenisnya adalah menghapus produk dan pid, ID produk hanyalah ID
produk yang diteruskan, seperti ini.
Sekarang dalam peredam, dalam file peredam produk, kita dapat mendengarkannya karena saat ini, kita
tidak pernah peduli dengan tindakan apa pun. Sekarang kita dapat mengaktifkan jenis tindakan di sini dan menangani kasus bahwa itu menghapus produk yang kita
dapatkan dari file tindakan produk kami dan karenanya Anda perlu menambahkan impor itu. Jika menghapus produk adalah kasusnya, kita perlu menghapus produk
dari array produk pengguna kami dan tentu saja juga dari array produk yang tersedia karena itu
dihapus secara umum, tidak hanya di produk pengguna kami tetapi dari seluruh
aplikasi.
Karenanya di
sini, saya akan mengembalikan objek baru tempat kami menyalin status yang ada untuk memastikan kami tidak kehilangan status apa pun dan sekarang
produk pengguna hanyalah status. userProducts, jadi produk pengguna
lama yang dapat kita filter, itu adalah metode Javascript bawaan yang mengembalikan array baru,
array baru yang pada dasarnya dibuat dengan menjalankan fungsi pada setiap item dalam array lama dan jika fungsi itu mengembalikan
true , kami menyimpan item itu, jika itu mengembalikan false, kami menjatuhkan item tersebut.
Jadi ini mengeksekusi fungsi di mana kita mendapatkan produk, fungsi ini dieksekusi untuk kita oleh Javascript
sehingga bisa dikatakan dan melewati item yang saat ini sedang melihat ke fungsi ini.
Jadi kami mendapatkan produk untuk setiap produk dalam array produk pengguna kami dan kami ingin mengembalikan ID produk, tidak seperti tindakan
pid yang merupakan ID produk yang ingin kami hapus.
Apa artinya ini adalah bahwa pada dasarnya itu akan menjaga semua produk di mana ID tidak cocok, jika mereka cocok, kita
tahu itu produk yang ingin kita singkirkan dan
oleh karena itu kita
mengembalikan false yang berarti dalam array baru, itu tidak akan termasuk.
Sekarang pada dasarnya logika yang sama untuk produk yang tersedia, di sana
kita hanya perlu memeriksa semua produk yang tersedia dan menyaring produk di sana.
Ini adalah satu perubahan yang perlu kita lakukan, perubahan lain perlu dilakukan di troli namun karena
ketika kita menghapus suatu produk, itu harus dihapus dari gerobak juga karena kalau tidak kita
memiliki produk di gerobak yang tidak ada lagi .
Jadi di sini, saya juga akan menambahkan kasus untuk menghapus produk dan karenanya Anda perlu mengimpor produk hapus dari produk tindakan di
keranjang. Peredam
js juga dan di
sini, kami perlu memastikan bahwa kami menghapus produk dari keranjang jika sudah dihapus.
Jadi di sini di troli, tentu saja kami mendapatkan ID produk kami dari produk yang
ingin kami hapus, pid ini dalam tindakan yang dikirim, jadi oleh karena itu di sini kami mengembalikan status baru tempat kami ingin memperbarui keranjang kami dan jumlah
total sedemikian rupa sehingga produk hilang dan hilang, maksud saya benar-benar dihapus dari
keranjang, tidak hanya dikurangi satu tetapi benar-benar dihapus. Jadi item di sini pada akhirnya merupakan salinan dari
item
yang ada tanpa produk itu, jadi saya akan membuat konstan baru, item yang diperbarui di mana saya menyalin item negara saya yang ada
di sini, seperti
ini dan kemudian saya menghapus item yang diperbarui untuk tindakan pid, jadi saya menghapus item ini dari troli.
Tentu saja ini hanya masuk akal jika item ini ada di troli, jadi saya pertama-tama akan memeriksa apakah item negara untuk tindakan
pid, jika itu mengembalikan sesuatu yang berarti dan jika tidak, maka saya
hanya akan mengembalikan negara yang ada karena maka saya sudah selesai dengan kasus ini, saya tidak perlu mengubah apa
pun di negara bagian, jadi saya hanya akan mengembalikan negara yang ada tanpa perubahan.
Jika saya berhasil melewati ini
jika memeriksa, maka saya tahu bahwa produk dengan ID yang akan kami hapus adalah bagian dari item tersebut.
Jadi saya melanjutkan menyalin item saya, kemudian menghapus produk dari sana tetapi sebelum saya melakukannya, dapatkan
total item dengan mengakses item negara untuk tindakan pid dan kemudian di sana, tentu saja kita memiliki ini, jika kita melihat keranjang
model barang yang saya maksud, kami memiliki kolom jumlah ini di sini, jadi pada akhirnya
di sini saya perlu menghapus jumlahnya. Saya tertarik dengan jumlahnya karena sekarang saya dapat memperbarui item
saya di sana dengan item yang diperbarui di mana saya menghapusnya dengan kata kunci hapus dan jumlah total keranjang adalah jumlah
total negara dikurangi total item, sehingga total keranjang ini barang yang telah kami tambahkan sebelumnya. Jadi sekarang kami memperbarui keranjang dengan tepat
juga
saat kami menghapus ini. Sekarang kita hanya perlu mengirim penghapusan
ini, jadi kembali ke
produk pengguna, di sini di delete, kami ingin mengirim. Jadi dari React Redux kita dapat mengimpor menggunakan dispatch
untuk mendapatkan akses ke fungsi dispatch di sini dengan memanggil
use dispatch seperti yang kita lakukan berkali-kali sebelum dan kemudian di sini, ketika delete ditekan, kita dapat mengirim aksi kita
dan
untuk itu
tentu saja, kita perlu untuk mengimpor tindakan ini, jadi mari kita lakukan ini, mari kita impor mungkin semuanya sebagai tindakan produk dari folder toko, di sana
dari folder tindakan dan di sana dari file produk dan sekarang kami menggunakan tindakan
produk di sana ketika kami mengirim ini untuk memanggil hapus produk dan meneruskan ID produk yang tentu
saja adalah itemData. barang. id di sini karena kita
akan melalui semua produk di sini dan itu pada dasarnya berarti itemData itu. item merujuk pada contoh model produk kami,
setiap instance memiliki properti ID dan kami meneruskan ini untuk menghapus produk.
Jadi jika kita coba ini dan kita pergi ke admin dan saya klik hapus pada baju merah, memang sudah hilang di sini dan jika
saya kembali ke produk, itu sudah ada di sini juga.
Sekarang jika kita memuat ulang ini dan saya memang menambahkan baju merah ke keranjang, Anda melihatnya di sini, saya menambahkannya dua kali.
Sekarang jika saya pergi ke admin dan saya menghapusnya dan saya kembali ke produk dan ke troli, troli sekarang kosong.
Di sisi lain, jika saya menambahkan katakanlah karpet dan cangkir kopi sekarang, kembali ke admin,
hapus karpet tetapi bukan cangkir kopi, Anda lihat di produk, cangkir kopi
masih di dalam kereta, sehingga tidak kerja. Ngomong-ngomong, Anda mungkin memperhatikan bahwa cangkir kopi agak terpotong di sini, itu sesuatu
yang akan saya perbaiki nanti bersama dengan fakta bahwa di sini, kita sebenarnya melihat minus sekarang untuk total, itu
juga sesuatu yang akan saya perbaiki dalam kedua.
Pertama-tama mari kita pastikan bahwa bagaimanapun
kita di bagian admin pergi ke layar edit atau bahwa kita juga memiliki item di sana yang memungkinkan kita
untuk menambahkan produk baru.