আমি এর উত্তরের জন্য অনুসন্ধান করার চেষ্টা করেছি, তবে তাদের বেশিরভাগই প্রতিক্রিয়ার প্রসঙ্গে, যেখানে onChangeঅস্পষ্ট হয়ে ওঠে ।
বিভিন্ন পরীক্ষা করার সময়, আমি এই দুটি ঘটনা কী আলাদা (কোনও টেক্সেরিয়ায় প্রয়োগ করা হয়) তা বলতে পারি না। কেউ কি এটার উপর একটু আলো ফেলতে পারো?
onChange) কিছুটা আলাদা আচরণ করে । এবং না, একটি টেক্সেরিয়ায় পাঠ্য আটকানো (প্রতিক্রিয়াতে) onChangeএবং উভয়কেই ট্রিগার করে onInput। একটি বেড়াতে পরীক্ষা নিখরচায় এবং আপনি দেখতে পাবেন।
onChangeট্রিগার হবে এবং onInputহবে না, তবে উভয়ই ট্রিগার করবে।
উত্তর:
প্রতিক্রিয়া, কোনও কারণে, শ্রোতাদের Component.onChangeDOM element.oninputইভেন্টের জন্য সংযুক্ত করে । ফর্মগুলিতে নথিতে নোটটি দেখুন:
আরও অনেক লোক আছেন যারা এই আচরণ দেখে অবাক হন। আরও বিশদের জন্য, প্রতিক্রিয়া ইস্যু ট্র্যাকার এই সমস্যাটি দেখুন:
কীভাবে প্রতিক্রিয়ার অন চেঞ্জ অন ইনপুট # 3964 এর সাথে সম্পর্কিত Document
এই বিষয়ে মন্তব্য থেকে উদ্ধৃতি:
আমি বুঝতে পারি না কেন প্রতিক্রিয়া অন-ইনপুট-এর মতো আচরণ করতে অন চেঞ্জ করা বেছে নিয়েছিল। আমি যত তাড়াতাড়ি বলতে পারি, আমাদের পুরানো অন চেঞ্জের আচরণ ফিরে পাওয়ার কোনও উপায় নেই। ডক্স দাবি করে যে এটি একটি "মিসনোমোমার" তবে এটি আসলে নয়, কোনও পরিবর্তন এলে তা আগুন ধরে যায়, যতক্ষণ না ইনপুটটিও ফোকাস হারায়।
বৈধতার জন্য, কখনও কখনও আমরা টাইপিং না করা পর্যন্ত বৈধতা ত্রুটিগুলি দেখাতে চাই না। অথবা আমরা কেবল প্রতিটি কীস্ট্রোককে পুনরায় রেন্ডার করতে চাই না। এখন এটি করার একমাত্র উপায় হ'ল অন্লুর সাথে তবে এখন আমাদের এটিও পরীক্ষা করতে হবে যে মানটি নিজেই পরিবর্তিত হয়েছে।
এটি কোনও চুক্তির চেয়ে বড় বিষয় নয়, তবে আমার কাছে মনে হয় যে প্রতিক্রিয়া একটি কার্যকর ইভেন্টটিকে ছুঁড়ে ফেলেছে এবং স্ট্যান্ডার্ড আচরণ থেকে বিচ্যুত হয়েছে যখন ইতিমধ্যে এটির একটি ইভেন্ট ছিল তখন।
আমি মন্তব্যটির সাথে 100% একমত ... তবে আমার ধারণা এখন এটিকে পরিবর্তন করা যতটা সমাধান হবে তার চেয়ে আরও বেশি সমস্যা নিয়ে আসবে কারণ ইতিমধ্যে এতটা কোড লেখা হয়েছিল যা এই আচরণের উপর নির্ভর করে।
প্রতিক্রিয়া অফিসিয়াল ওয়েব এপিআই সংগ্রহের অংশ নয়
যদিও প্রতিক্রিয়াটি জেএসের শীর্ষে নির্মিত এবং এটি একটি বিশাল গ্রহণের হার দেখেছিল, যেমন একটি প্রযুক্তি প্রতিক্রিয়া তার নিজস্ব (মোটামুটি ছোট) API এর অধীনে পুরো কার্যকারিতা আড়াল করার জন্য বিদ্যমান। একবার অঞ্চল যেখানে এটি সুস্পষ্ট তা ইভেন্ট সিস্টেমে থাকে, যেখানে পৃষ্ঠের অধীনে প্রচুর পরিমাণে চলছে যা আসলে স্ট্যান্ডার্ড ডিওএম ইভেন্ট সিস্টেমের থেকে মূলত আলাদা। কোন ইভেন্টগুলি কেবল কী করে সেগুলির ক্ষেত্রেই নয়, ইভেন্ট হ্যান্ডলিংয়ের কোন পর্যায়ে যখন ডেটা অব্যাহত রাখার অনুমতি দেওয়া হয় সে ক্ষেত্রেও। এখানে তার সম্বন্ধে আরও পড়তে পারেন:
এখানে কোন পার্থক্য নেই
প্রতিক্রিয়ার ডিফল্ট 'অন চেঞ্জ' ইভেন্টের আচরণ নেই। আমরা যে 'অন চেঞ্জ'কে প্রতিক্রিয়া দেখি তা ডিফল্ট' অন ইনপুট 'ইভেন্টের আচরণ করে। সুতরাং আপনার প্রশ্নের উত্তর দেওয়ার জন্য প্রতিক্রিয়ার ক্ষেত্রে উভয়ের মধ্যে কোনও পার্থক্য নেই। আমি একই বিষয়ে গিটহাবের উপরে একটি ইস্যু উত্থাপন করেছি এবং এটি সম্পর্কে তাদের এই কথাটি বলতে হবে:
আমার মনে হয় যে সময়ে এই সিদ্ধান্ত নেওয়া হয়েছিল (~ 4 বছর আগে?), অনপুট ব্রাউজারগুলির মধ্যে অবিচ্ছিন্নভাবে কাজ করে না, এবং অন্যান্য প্ল্যাটফর্মগুলি থেকে ওয়েবে আসা লোকদের বিভ্রান্ত করেছিল, কারণ তারা "পরিবর্তন" ইভেন্টটি আশা করবে প্রতিটি পরিবর্তন আগুন। প্রতিক্রিয়া ক্ষেত্রে এটি একটি বড় সমস্যা কারণ আপনি যদি খুব শীঘ্রই পরিবর্তনটি পরিচালনা করতে ব্যর্থ হন তবে নিয়ন্ত্রিত ইনপুটগুলি কখনই আপডেট হয় না, লোকেদের প্রতিক্রিয়া ভাঙ্গা ভাবাতে নেতৃত্ব দেয়। তাই দলটি অন চেঞ্জ করে কল দিয়ে গেল।
পূর্বনির্ধারণে অনিপুটটি পলফিল করা এবং অন্য ইভেন্টের আচরণ পরিবর্তনের পরিবর্তে এর নামটি রাখা আরও ভাল ধারণা হতে পারে। তবে সেই জাহাজটি অনেক আগে যাত্রা করেছে। আমরা ভবিষ্যতে এই সিদ্ধান্তটি আবার ঘুরে দেখতে পারি, তবে আমি আপনাকে এটিকে রিট্যাক্ট ডোম (যা আপনার খুব তাড়াতাড়ি অভ্যস্ত হয়ে উঠবে) এর এক দশা হিসাবে বিবেচনা করার জন্য উত্সাহিত করব।
https://github.com/facebook/react/issues/9567
এছাড়াও এই নিবন্ধটি আরও অন্তর্দৃষ্টি প্রদান করবে। ডিফল্ট 'অন চেঞ্জ' নিখোঁজ হওয়ার জন্য একটি কার্যপ্রণালী হিসাবে, নিবন্ধটি 'অনব্লুর' ইভেন্টটি শোনার পরামর্শ দিয়েছে।
সম্প্রতি আমি একটি বাগ পেয়েছি যেখানে onChangeআইই 11 এ ইনপুট ক্ষেত্রে অনুলিপি এবং আটকানোর অনুমতি দেবে না। যদিও onInputইভেন্টটি সেই আচরণের অনুমতি দেয়। ডক্সে এটি বর্ণিত কোনও ডকুমেন্টেশন আমি পাইনি, তবে এটি দেখায় যে দুটি (প্রত্যাশিত বা না) মধ্যে পার্থক্য রয়েছে।
যে কেউ এই সমস্যাটিতে হোঁচট খেয়েছে সত্যিকারের, ডিওএম-ভিত্তিক changeইভেন্টটি শোনার জন্য উপায় খুঁজছেন , আমি এটি এটি করেছিলাম (টাইপস্ক্রিপ্টে লিখিত):
import { Component, createElement, InputHTMLAttributes } from 'react';
export interface CustomInputProps {
onChange?: (event: Event) => void;
onInput?: (event: Event) => void;
}
/**
* This component restores the 'onChange' and 'onInput' behavior of JavaScript.
*
* See:
* - https://reactjs.org/docs/dom-elements.html#onchange
* - https://github.com/facebook/react/issues/3964
* - https://github.com/facebook/react/issues/9657
* - https://github.com/facebook/react/issues/14857
*/
export class CustomInput extends Component<Omit<InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'onInput' | 'ref'> & CustomInputProps> {
private readonly registerCallbacks = (element: HTMLInputElement | null) => {
if (element) {
element.onchange = this.props.onChange ? this.props.onChange : null;
element.oninput = this.props.onInput ? this.props.onInput : null;
}
};
public render() {
return <input ref={this.registerCallbacks} {...this.props} onChange={undefined} onInput={undefined} />;
}
}
আপনি যদি এই পদ্ধতির উন্নতি করার উপায় দেখতে পান বা এটির সাথে সমস্যার মুখোমুখি হন তবে আমাকে জানান know বিপরীতে blur, changeইভেন্টটি ট্রিগার করা হয় যখন ব্যবহারকারী চাপলে প্রবেশ করে এবং কেবল তখনই ট্রিগার হয় যখন মানটি আসলে পরিবর্তিত হয়।
আমি এখনও এই CustomInputউপাদান সঙ্গে অভিজ্ঞতা অর্জন করছি । উদাহরণস্বরূপ, চেকবাক্সগুলি অদ্ভুত আচরণ করে। আমি হয় বিপরীতমুখী আছে event.target.checkedমধ্যে onChangeহ্যান্ডলার যখন সঙ্গে চেকবক্সটি মান ক্ষণস্থায়ী checkedবা এই বিপর্যয় পরিত্রাণ পেতে যখন সঙ্গে চেকবক্সটি মান ক্ষণস্থায়ী defaultCheckedকিন্তু এই তারপর বিরতি বিভিন্ন চেকবাক্সগুলিতে সুসংগত পৃষ্ঠাটি রাখুন বিভিন্ন স্থানে একই রাষ্ট্র প্রতিনিধিত্বমূলক । (উভয় ক্ষেত্রেই, আমি চেকবক্সগুলির জন্য কোনও onInputহ্যান্ডলার পাস করি নি CustomInput))
একটি পার্থক্য বলে মনে হচ্ছে যে onChangeএকই চরিত্রের সাথে একটি চরিত্র নির্বাচন এবং প্রতিস্থাপনের সময় বরখাস্ত করা হয়নি onInput।
এই স্যান্ডবক্সটি দেখুন: https://codesandbox.io/s/react-onchange-vs-oninput-coggf?file=/src/app.js
onChange এবং 2onInput ।onInputইভেন্টের সূত্রপাত না হওয়া অবধি, তবে তা নয় onChange।