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('')

এরপর useDispatch-এর জন্য dispatch ভেরিয়েবল ডিক্লেয়ার করার পর, useSelector হুক ব্যবহার করে স্টেট থেকে বিক্রেতাদের স্লাইস পেতে কোড যোগ করি:

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

ইনপুট ফিল্ডের জন্য হ্যান্ডলারে আমরা আরও একটি যোগ করব:

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

onSaveProductClick-টি সংশোধন করি, productAdded একশনের জন্য sellerId যোগ করে:

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

আপনার শিক্ষার্থীদের অ্যাপ্লিকেশনটি খুলুন। শিক্ষার্থীদের যোগকারী শিক্ষক সম্পর্কে তথ্য যোগ করার ক্ষমতা যোগ করুন। এর জন্য, পাঠের উপাদানটি অধ্যয়ন করে, studentsSlice.js ফাইলে prepare ফাংশনের জন্য পরিবর্তনগুলি আনুন।

NewStudentForm.jsx ফাইলে সংশ্লিষ্ট পরিবর্তনগুলি আনুন