রাষ্ট্রগুলির সাথে প্রতিক্রিয়াতে প্রতিক্রিয়া আনুন

আনস্প্ল্যাশ থেকে @igorovsyannykov দ্বারা ছবি
এটি প্রতিক্রিয়া, এর মূল বৈশিষ্ট্য এবং সেরা অনুশীলনগুলি প্রবর্তন করার বিষয়ে আমার "প্রতিক্রিয়াশীলদের জন্য প্রতিক্রিয়া" সিরিজের একটি অংশ। আরও নিবন্ধ অনুসরণ করা হবে!

প্রতিক্রিয়া উপাদানটি কীভাবে প্রদর্শন করবেন তা জেনে রাখা দুর্দান্ত। এখন আমরা আমাদের উপাদানগুলিকে তাদের নিজস্ব ডেটা দেই।

দাবি অস্বীকার: এই নিবন্ধটি প্রতিক্রিয়ার অন্তর্নির্মিত অবস্থার উপর দৃষ্টি নিবদ্ধ করে। নোট করুন যে উপাদানগুলির স্থিতি এবং রিডেক্সগুলি তাদের উদ্দেশ্যগুলি পৃথক হওয়ার কারণে এটি বেমানান নয়।

আমার মতে, উপাদান স্থিতি উপাদান ফর্মটি পূরণ করার জন্য নির্দিষ্ট (ফর্মটি পূরণ করার জন্য)। Redux স্থিতি অনেক উপাদানগুলির জন্য একই স্থিতি প্রকাশ করতে সহায়তা করে।

আমার কি রাষ্ট্র দরকার?

রাজ্যগুলি শিখতে, আমরা একটি প্রশ্ন উপাদান তৈরি করব। একটি হ্যাঁ / কোন প্রশ্ন প্রদর্শিত হয় এবং উত্তর জিজ্ঞাসা করা হয়।

আমাদের প্রশ্নের উপাদানটিতে কেবল তিনটি ফাংশন রয়েছে:

  • আরম্ভের জন্য নির্মাণকারী (প্রপস এবং স্থিতি),
  • উত্তরকিউশন হ'ল একটি কলব্যাক যা ট্রিগার করা হয় যখন ব্যবহারকারী উত্তর দেয়
  • আপনি সম্ভবত যা জানেন তা রেন্ডার করুন - এটি উপাদানটির টেমপ্লেটকে আউটপুট দেয়।

এই উপাদানটির দুটি পৃথক রাজ্য রয়েছে। প্রশ্নের উত্তর দেওয়া হয়নি বা প্রশ্নের উত্তর রয়েছে has

প্রপস কেবলমাত্র প্রশ্ন লেবেলের জন্য ব্যবহৃত হয় এবং এর পাশাপাশি, রাজ্যের উদ্দেশ্যটি আরও আকর্ষণীয়।

রাজ্য হল সেই উপাদান স্টোর যা মনে রাখে যে প্রশ্নের উত্তর আছে কিনা। যদি তা হয় তবে এটির উত্তরও জানে।

প্রপসগুলিতে রাষ্ট্রকে পরিণত করুন

একটি উপাদান একটি রাষ্ট্র ব্যবহার করা সহজ। আপনি স্থিতি আরম্ভ করতে হবে এবং আপনি সামগ্রী আপডেট করতে চাইলে সেটস্টেট ফাংশনটি কল করতে হবে।

কল্পনা করুন আপনি একটি উপাদান। যদি আপনার স্থিতি পরিবর্তন হয় তবে আপনার প্রতিক্রিয়াটি আপনার বিজ্ঞাপনটি আপডেট করার দরকার আছে কিনা তা দেখতে হবে।

এটি এভাবেই কাজ করে। রেন্ডার কল করার আগে কম্পোনেন্ট আপডেটের কলগুলিতে প্রতিক্রিয়া জানুন (ডকুমেন্টেশন দেখুন)। এই দ্বিতীয় ফাংশনটি পরবর্তী ভার্চুয়াল ডিওএম স্থিতি উত্পন্ন করে (আমি এটি আমার শেষ নিবন্ধে বললাম)।

উপাদানগুলি অন্যান্য উপাদানগুলির থেকে প্রপস পায়। যদি এই প্রপস পরিবর্তন হয় তবে উপাদানটি আপডেট করা হবে।

আসলে, এটি কীভাবে কাজ করে তা আপনি ইতিমধ্যে জানেন - তবে আসুন কয়েকটি প্রশ্ন সহ জরিপের উদাহরণটি নেওয়া যাক।

সমীক্ষায় এর স্থিতিতে প্রশ্ন চিহ্ন রয়েছে এবং এটি সম্পত্তি হিসাবে প্রশ্নে স্থান দেয়।

যখন সমীক্ষা তার স্থিতি আপডেট করে (কল সেটস্টেট), তখন রেন্ডারিং ফাংশনটি ট্রিগার হয়। এই ক্ষেত্রে প্রশ্নগুলি রেন্ডার করার জন্য একটি অনুরোধ পাঠানো হয়েছে (প্রতিক্রিয়া ডকের বিবরণে)

ধারক নমুনা গ্রহণ করুন

কোডটি দেখুন এবং বাকী সমস্ত অংশটিকে ডিকোপল করা বিকাশকারীদের জন্য বরাবরই একটি বড় উদ্বেগ। এই কারণে ফ্রেমওয়ার্কগুলিতে ব্যবহৃত বেশিরভাগ ডিজাইনের ধরণগুলি এমভিসি প্যাটার্ন ধরে নেয়।

আপনি যদি রেডাক্সের সাথে প্রতিক্রিয়া ব্যবহার করেন তবে আপনি ইতিমধ্যে ধারক প্যাটার্নটি জানেন। প্রকৃতপক্ষে, এটি সংযোগ ফাংশনটির মাধ্যমে একটি সংহত রাডেক্স ফাংশন x

এখন প্রশ্নের উপাদানটি দুটি উপাদানে বিভক্ত করার সময়।

প্রপস রেন্ডারিংয়ের জন্য প্রশ্ন দায়বদ্ধ। এই ধরণের উপাদানটি কার্যকরী, উপস্থাপক বা বোবা উপাদান হিসাবে পরিচিত।

প্রশ্নোত্তরকারী শর্ত পরিচালনার যত্ন নেয়।

এমভিসি ডিজাইনের প্যাটার্নের সাথে তুলনা করতে, প্রশ্ন একটি ভিউ এবং প্রশ্নোত্তরকারী একটি নিয়ামক।

অন্যান্য উপাদানগুলির জন্য যেখানে প্রশ্ন প্রয়োজন এখন প্রশ্নের পরিবর্তে প্রশ্নোত্তর ব্যবহার করুন use এই বিবেচনাটি সম্প্রদায়ের মধ্যে ভালভাবে গৃহীত।

সেটস্টেট অ্যান্টি-প্যাটার্নটি সম্পর্কে সতর্কতা অবলম্বন করুন

এই সেটস্টেটটি ব্যবহার করা বেশ সোজা is

প্রথম এবং একমাত্র পরামিতি হিসাবে পরবর্তী রাজ্যটি পাস করুন। বর্তমান স্থিতি বৈশিষ্ট্য নতুন স্থানান্তরিত মানগুলির সাথে আপডেট হয় are

সংক্ষেপে, এটি বলা যেতে পারে যে আপনি এগুলি ব্যবহার করেন না at স্ট্যাটাস এবং এগুলি set

এই ভেরিয়েবলগুলির প্রত্যাশিত মান নাও থাকতে পারে। প্রতিক্রিয়া রাজ্যের পরিবর্তনগুলি অনুকূলিত করে। পারফরম্যান্স সমস্যার কারণে (ভার্চুয়াল ডিওএম অনুকূলিতকরণের পূর্বে) একাধিক পরিবর্তন এক সাথে একীভূত হয়।

আপনার সেট স্টেটের অন্য ফর্মটি পছন্দ করা উচিত। একমাত্র পরামিতি হিসাবে একটি ফাংশন প্রবেশ করুন এবং পরামিতি প্রো এবং রাষ্ট্র ব্যবহার করুন (ডকুমেন্টেশন দেখুন) see

সম্পূর্ণ সমীক্ষার উপাদান

এই নিবন্ধে, আমরা প্রতিক্রিয়ার রাজ্যের প্রধান ব্যবহারগুলি কভার করেছি। জরিপ উপাদানটির জন্য সম্পূর্ণ কোডটি নীচের কোডপেনে পাওয়া যাবে।

এটি ছিল সমস্ত রাজ্য সম্পর্কে। আপনি উপাদানগুলি, প্রপস এবং শর্তগুলির মুখোমুখি হয়েছিলেন এবং প্রতিক্রিয়াটির সাথে খেলার জন্য আপনার কাছে এখন শুরুতে কিট।

আশা করি আপনি এই নিবন্ধটি উপভোগ করেছেন এবং অনেক কিছু শিখলেন!

আপনি যদি এই নিবন্ধটি দরকারী মনে করেন, অনুগ্রহ করে অন্যদের নিবন্ধটি সন্ধান করতে এবং আপনার সমর্থন দেখানোর জন্য several বোতামটি কয়েকবার ক্লিক করুন!

আমার আসন্ন আইটেম সম্পর্কে অবহিত করতে আমাকে অনুসরণ করতে ভুলবেন না

এটি প্রতিক্রিয়া, এর মূল বৈশিষ্ট্য এবং সেরা অনুশীলনগুলি প্রবর্তন করার বিষয়ে আমার "প্রতিক্রিয়াশীলদের জন্য প্রতিক্রিয়া" সিরিজের একটি অংশ।

আমার অন্যান্য আইটেম পরীক্ষা করে দেখুন

➥ জাভাস্ক্রিপ্ট

  • আপনার নিজের ওয়েব বিকাশ ফ্রেমওয়ার্ক ফ্রেমওয়ার্ক লিখে আপনার জাভাস্ক্রিপ্ট দক্ষতা কীভাবে উন্নত করবেন
  • Vue.js এর সাথে কাজ করার সময় সাধারণ ভুলগুলি এড়াতে

Ips টিপস এবং কৌশল

  • বেদনাদায়ক জাভাস্ক্রিপ্ট ডিবাগিং ছেড়ে এবং উত্স মানচিত্রের সাথে ইন্টেলিজ ব্যবহার করুন
  • এইভাবে, আপনি সহজেই প্রচুর জাভাস্ক্রিপ্ট বান্ডিল হ্রাস করতে পারেন