Redux වල තවත් slice එකක් එකතු කිරීම

කලින් පාඩම්වලදී අපි products සඳහා ඇති products slice එක කෙරෙහි තදින් වැඩ කළෙමු. සැබෑ Redux යෙදුමක state එක තුළ විවිධ අවශ්‍යතා සඳහා slices ගොඩක් තිබිය හැකිය. එබැවින් මෙම පාඩමේදී අපි state එකට තවත් slice එකක් එකතු කරන්නෙමු, අපගේ යෙදුමේ products එකතු කරන විකුණුම්කරුවන් සඳහායි.

අපගේ products යෙදුම විවෘත කර ගෙන, පළමුව අපි කරන්නේ parts ෆෝල්ඩරය තුළ තවත් ෆෝල්ඩරයක් නිර්මාණය කිරීමයි: sellers. මෙහිදී අපි විකුණුම්කරුවන්ට අදාළ සියලු කේත සහ components තබමු.

දැන්, products සමඟ වූ ආකාරයටම, අපි විකුණුම්කරුවන් සඳහා 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 භාවිතයෙන් sellers slice එක නිර්මාණය කරමු, එයට ආරම්භක අගය පවරමු. අපි අනාගතයේදී විකුණුම්කරුවන් එකතු කිරීම හෝ ඔවුන්ගේ දත්ත යාවත්කාලීන කිරීම කරන්නේ නැති නිසා, reducers ක්ෂේත්‍රය හිස්ව තබමු:

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

ගොනුවේ අවසානයේදී, ලබාගත් reducer එක නිර්යාත කිරීම අමතක නොකරමු:

export default sellersSlice.reducer

දැන් අපි app ෆෝල්ඩරය තුළ ඇති store.js ගොනුව විවෘත කර ලබාගත් reducer එක ආයාත කළ යුතුයි:

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

ඉන්පසුව එය configureStore තුළ sellers සඳහා වන reducer ලෙස පවරමු:

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

ඔබගේ ශිෂ්‍යයින් සමඟ ඇති යෙදුම විවෘත කරන්න. තවත් ෆෝල්ඩරයක් නිර්මාණය කරන්න: teachers, මෙහිදී ඔබට ආචාර්යවරුන්ට අදාළ කේත ගොනු තිබේ. එහි ගොනුවක් නිර්මාණය කරන්න teachersSlice.js. පාඩම් ද්‍රව්‍ය භාවිතා කරමින්, එහි slice එකක් නිර්මාණය කරන්න teachers, createSlice භාවිතා කරමින්.

සෑම ආචාර්ය දත්ත වස්තුවකටම ගුණාංග තුනක් තිබිය යුතුය: id, name (එය වාචික නම සහ අක්ෂර, උදාහරණයක් ලෙස 'පෙට්‍රොව් ඒ.වී.' අඩංගු වේ) සහ විෂයය (ඔබට හිතෙන ඕනෑම දෙයක් - භෞතික විද්‍යාව, ගණිතය, ජීව විද්‍යාව යනාදිය). slice එක සඳහා ආරම්භක අගය ලෙස ආචාර්යවරුන් 3 දෙනෙකුගේ වස්තු කරන්න.

ලබාගත් teachersReducer reducer එක store.js වෙත ආයාත කර එය teachers සඳහා වන reducer ලෙස පවරන්න, පාඩමේ දැක්වෙන ආකාරයට.