Aggiunta di informazioni sul venditore in Redux

Avevamo parlato del fatto che i nostri prodotti vengono effettivamente aggiunti all'applicazione dai venditori. Inseriamo le informazioni sul venditore quando aggiungiamo un nuovo prodotto.

Apriamo la nostra applicazione di prodotti, e in essa il file productsSlice.js. Trasmettiamo in prepare un ulteriore parametro, chiamiamolo sellerId e impostiamolo poi per il payload dell'azione. Ora il nostro frammento di codice per prepare sarà così:

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

Ora dobbiamo apportare una serie di modifiche al file con il modulo per l'aggiunta del prodotto NewProductForm.jsx. Per iniziare, aggiungiamo un altro stato locale per l'id del venditore:

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

Poi, dopo la dichiarazione della variabile dispatch per useDispatch, aggiungiamo il codice per ottenere la slice dei venditori dallo stato usando l'hook useSelector:

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

Aggiungiamo un altro gestore ai gestori dei campi di input:

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

Modifichiamo onSaveProductClick, aggiungendo sellerId all'azione productAdded:

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

Apri la tua applicazione con gli studenti. Aggiungi la possibilità di inserire informazioni sull'insegnante che ha aggiunto gli studenti. Per farlo, studiando il materiale della lezione, apporta le modifiche alla funzione prepare nel file studentsSlice.js.

Apporta le modifiche corrispondenti nel file NewStudentForm.jsx