Müüja teabe lisamine Reduxis

Me rääkisime sellest, et meie tooted lisatakse rakendusse tegelikult müüjate poolt. Paneme uus toode lisades kuvama müüja teavet.

Avame oma tooterakenduse, ja selles faili productsSlice.js. Hakkame prepare-le edastama veel üht parameetrit, nimetame selle sellerId ja määrame selle seejärel ekseemli payload jaoks. Nüüd on meie prepare koodilõik selline:

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

Nüüd peame tegema mitmeid muudatusi failis toote lisamise vormiga NewProductForm.jsx. Alustuseks lisame veel ühe lokaalse oleku müüja id jaoks:

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

Seejärel pärast muutuja dispatch deklareerimist useDispatch jaoks, lisame koodi müüjate lõigu saamiseks olekust, kasutades haki useSelector:

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

Sisendväljade töötlejatele lisame veel ühe:

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

Korrigeerime onSaveProductClick, lisades ekseemlile productAdded ka sellerId:

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

Avage oma õpilaste rakendus. Lisage võimalus õpetaja teabe sisestamiseks, kes õpilased lisas. Selleks, uurides õppetunni materjali, tehke muudatusi funktsioonile prepare failis studentsSlice.js.

Tehke vastavad muudatused failis NewStudentForm.jsx