Menambah Maklumat Penjual dalam Redux

Kita telah bercakap tentang bagaimana produk kami sebenarnya ditambahkan ke dalam aplikasi oleh penjual. Mari kita paparkan maklumat tentang penjual apabila menambah produk baru.

Buka aplikasi produk kami, dan dalamnya fail productsSlice.js. Mari kita hantar satu lagi parameter kepada prepare, namakannya sellerId dan tetapkan ia kemudian untuk payload aksi. Sekarang coretan kod untuk prepare akan kelihatan seperti ini:

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

Sekarang kita perlu membuat beberapa perubahan dalam fail borang untuk menambah produk NewProductForm.jsx. Pertama, tambahkan satu lagi keadaan tempatan untuk id penjual:

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

Kemudian selepas pengisytiharan pembolehubah dispatch untuk useDispatch, tambahkan kod untuk mendapatkan kepingan penjual dari keadaan menggunakan kait useSelector:

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

Dalam pengendali untuk medan input, tambahkan satu lagi:

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

Sesuaikan onSaveProductClick, dengan menambahkan sellerId untuk aksi productAdded:

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

Buka aplikasi pelajar anda. Tambahkan keupayaan untuk memasukkan maklumat tentang pensyarah yang menambah pelajar. Untuk ini, dengan mengkaji bahan pelajaran, buat perubahan untuk fungsi prepare dalam fail studentsSlice.js.

Buat perubahan yang sesuai dalam fail NewStudentForm.jsx