Legge til informasjon om selger i Redux

Vi har snakket om at våre produkter faktisk legges til i applikasjonen av selgere. La oss ved tilføyelse av et nytt produkt vise informasjon om selgeren.

Åpne applikasjonen vår med produkter, og i den filen productsSlice.js. La oss sende inn i prepare en parameter til, la oss kalle den sellerId og sette den videre for payload til actionen. Nå vil vår lille kodebit for prepare se slik ut:

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

Nå må vi gjøre en rekke endringer i filen med skjemaet for å legge til produkt NewProductForm.jsx. Til å begynne med, la oss legge til en lokal state til for selgerens id:

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

Deretter, etter deklarasjonen av variabelen dispatch for useDispatch, la oss legge til kode for å hente ut selger-slicen fra staten ved hjelp av hooken useSelector:

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

I håndtererne for inntastingsfeltene legger vi til en til:

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

La oss justere onSaveProductClick ved å legge til for actionen productAdded også sellerId:

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

Åpne applikasjonen din med studenter. Legg til mulighet for å registrere informasjon om læreren som la til studentene. For å gjøre dette, etter å ha studert leksjonsmaterialet, gjør endringer for funksjonen prepare i filen studentsSlice.js.

Gjør de tilsvarende endringene i filen NewStudentForm.jsx