Яке дигар slice-и Redux-ро илова кардан

Дар дарсҳои гузашта мо зиҳд кор кардем дар slice-и products барои маҳсулот. Дар барномаи Real Redux дар state метавонад зиёд slice-ҳо барои мақсадҳои гуногун бошад. Аз ин рӯ, дар ин дарс мо ба state як slice-и дигар барои фурӯшандагоне, ки аслан маҳсулотро ба барномаи мо илова мекунанд, илова мекунем.

Барномаи моро бо маҳсулот кушоед ва аввалин чизе, ки мо мекунем, ин дар папкаи parts як папкаи дигар sellers эҷод мекунем, дар ин ҷо мо тамоми код ва компонентҳоро, ки ба фурӯшандагон дахл доранд, ҷойгир мекунем.

Акнун, монанди ҳолати маҳсулот, биёед slice барои фурӯшандагон эҷод кунем. Барои оғоз дар папкаи sellers файли sellersSlice.js эҷод карда ва createSlice-ро ба он ворид мекунем:

import { createSlice } from '@reduxjs/toolkit'

Мо қадамҳои стандартиро давом медиҳем. Ҳамчун арзиши ибтидоӣ барои slice чор фурӯшанда эҷод мекунем. Барои соддагӣ ду майдон доранд - id ва name:

const initialState = [
	{ id: '0', name: 'Super Power' },
	{ id: '1', name: 'Miracle Life' },
	{ id: '2', name: 'Dolls&Toys' },
	{ id: '3', name: 'Granny' },
]

Дар поён бо истифода аз createSlice slice-и sellers эҷод мекунем, арзиши ибтидоиро ба он месупорем. Азбаски мо фурӯшандагонро на илова мекунем, на маълумоташонро дар оянда нав мекунем, пас бигзор майдони редюсерҳо дар ҳоли ҳозир холӣ бимонӣ:

const sellersSlice = createSlice({
	name: 'sellers',
	initialState,
	reducers: {},
})

Дар охири файл фаромӯш накунед, ки редюсери гирифташударо экспорт кунед:

export default sellersSlice.reducer

Акнун мо бояд файли store.js дар папкаи app кушода ва редюсери гирифташударо ворид кунем:

import sellersReducer from '../parts/sellers/sellersSlice'

Ва сипас онро дар configureStore ҳамчун редюсер барои sellers таъин кунед:

export default configureStore({
	reducer: {
		products: productsReducer,
		sellers: sellersReducer,
	},
})

Барномаи худро бо донишҷӯён кушоед. Як папкаи дигар teachers эҷод кунед, дар ин ҷо файлҳои коде, ки ба муаллимон дахл доранд, мебошанд. Дар он файли teachersSlice.js эҷод кунед. Бо истифода аз маводҳои дарс, дар он slice-и teachers эҷод кунед бо ёрии createSlice.

Бигзор ҳар як объекти бо маълумоти муаллим се хусусият дошта бошад: id, name (ки фамилия ва инициалҳоро дар бар мегирад, масалан 'Петров А.В.') ва фанн (ҳар кадоме, ки тасаввур мекунед - физика, математика, биология ва ғайра). Аз ин гуна 3 объект бо муаллимон ҳамчун арзиши ибтидоӣ барои slice эҷод кунед.

Редюсери гирифташударо teachersReducer ба store.js ворид кунед ва онро ҳамчун редюсер барои teachers таъин кунед, тавре ки дар дарс нишон дода шуд.