Վաճառողի տվյալների ավելացումը Redux-ում

Մենք ձեզ հետ խոսեցինք այն մասին, որ մեր ապրանքները փաստորեն ավելացվում են հավելվածի կողմից վաճառողների կողմից: Եկեք նոր ապրանք ավելացնելիս ցուցադրենք վաճառողի մասին տեղեկատվությունը:

Բացենք մեր ապրանքների հավելվածը, իսկ դրա մեջ productsSlice.js ֆայլը: Եկեք prepare-ին փոխանցենք ևս մեկ պարամետր, անվանենք այն sellerId և սահմանենք այն հետագայում payload էքշնի համար: Այժմ մեր prepare-ի կոդի կտորը կլինի այսպիսին.

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

Այժմ մենք պետք է մի շարք փոփոխություններ կատարենք ապրանք ավելացնելու ձևը պարունակող ֆայլում NewProductForm.jsx: Սկզբում ավելացնենք ևս մեկ լոկալ սթեյթ վաճառողի id-ի համար.

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

Այնուհետև dispatch փոփոխականի հայտարարումից հետո useDispatch-ի համար, ավելացնենք կոդ՝ վաճառողների սլայսը ստանալու համար սթեյթից useSelector հուկի միջոցով.

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

Մուտքագրման դաշտերի համար մշակիչներին ավելացնենք ևս մեկը.

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

Ուղղենք onSaveProductClick-ը՝ ավելացնելով productAdded էքշնի համար նաև sellerId-ը.

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

Բացեք ձեր ուսանողների հավելվածը: Ավելացրեք ուսանողներին ավելացնող դասախոսի տվյալները մուտքագրելու հնարավորությունը: Դրա համար, ուսումնասիրելով դասի նյութը, կատարեք փոփոխություններ prepare ֆունկցիայի համար studentsSlice.js ֆայլում:

Կատարեք համապատասխան փոփոխություններ NewStudentForm.jsx ֆայլում