Adăugarea informațiilor despre vânzător în Redux

Am vorbit despre faptul că produsele noastre sunt de fapt adăugate în aplicație de către vânzători. Haideți ca atunci când adăugăm un produs nou să afișăm informații despre vânzător.

Deschideți aplicația noastră cu produse, iar în ea fișierul productsSlice.js. Haideți să transmitem în prepare încă un parametru, să-l numim sellerId și să îl setăm mai departe pentru payload al acțiunii. Acum bucata noastră de cod pentru prepare va arăta astfel:

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

Acum trebuie să facem o serie de modificări în fișierul cu formularul pentru adăugarea produsului NewProductForm.jsx. Pentru început să adăugăm încă o stare locală pentru id-ul vânzătorului:

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

Apoi, după declararea variabilei dispatch pentru useDispatch, să adăugăm cod pentru obținerea slice-ului vânzătorilor din stare folosind hook-ul useSelector:

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

În handler-ele pentru câmpurile de introducere să adăugăm încă unul:

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

Să ajustăm onSaveProductClick, adăugând pentru acțiunea productAdded și sellerId:

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

Deschideți aplicația dvs. cu studenții. Adăugați posibilitatea introducerii informațiilor despre profesorul care a adăugat studenții. Pentru aceasta, studiind materialul lecției, faceți modificări pentru funcția prepare în fișierul studentsSlice.js.

Faceți modificările corespunzătoare în fișierul NewStudentForm.jsx