Menambahkan Informasi Penjual ke Redux

Kita telah membahas bahwa produk-produk kita sebenarnya ditambahkan ke aplikasi oleh para penjual. Mari saat menambahkan produk baru, kita tampilkan informasi tentang penjualnya.

Buka aplikasi produk kita, dan di dalamnya file productsSlice.js. Mari kita teruskan ke prepare satu parameter lagi, sebut saja sellerId dan atur itu selanjutnya untuk payload aksi. Sekarang potongan kode kita untuk prepare akan menjadi seperti ini:

prepare(name, desc, price, amount, sellerId) {
	return {
		payload: {
			id: nanoid(),
			name,
			desc,
			price,
			amount,
			seller: sellerId,
		},
	}
},

Sekarang kita perlu melakukan serangkaian perubahan pada file dengan formulir untuk menambahkan produk NewProductForm.jsx. Pertama, tambahkan satu state lokal lagi untuk id penjual:

const [sellerId, setSellerId] = useState('')

Kemudian setelah deklarasi variabel dispatch untuk useDispatch, tambahkan kode untuk mendapatkan slice penjual dari state menggunakan hook useSelector:

const sellers = useSelector((state) => state.sellers)

Ke handler untuk field input, tambahkan satu lagi:

const onSellerChanged = (e) => setSellerId(e.target.value)

Sesuaikan onSaveProductClick, dengan menambahkan untuk aksi productAdded juga sellerId:

dispatch(productAdded(name, desc, price, amount, sellerId))

Buka aplikasi Anda dengan data mahasiswa. Tambahkan kemampuan untuk memasukkan informasi tentang dosen yang menambahkan mahasiswa. Untuk ini, pelajari materi pelajaran, lakukan perubahan untuk fungsi prepare di file studentsSlice.js.

Lakukan perubahan yang sesuai di file NewStudentForm.jsx