React: [خطأ] يتم إعادة تدوير أحداث React onChange Synthetic / Proxy ، وتصدر المشكلة عند إلغاء معالجة المعالج

تم إنشاؤها على ٢٠ سبتمبر ٢٠١٦  ·  3تعليقات  ·  مصدر: facebook/react

ما هو السلوك الحالي؟

تم التأكيد اعتبارًا من 0.14.7 ولكنه يحدث اليوم أيضًا في 15.3.2.

https://jsfiddle.net/dimitar/7ktbfetb/

class Foo extends React.Component {
    render(){
    const handleChange = _.debounce(this.props.onChange, 500);
    return <input onChange={handleChange} />
  }
}

ReactDOM.render(<Foo onChange={e => console.log(e.target, e)} />, document.querySelector('div'));

توقع الحصول على e.target ، واحصل على null

بدون إبطال ، يعمل كما هو متوقع. https://jsfiddle.net/dimitar/7ktbfetb/1/

ربما تتعلق بـ https://github.com/facebook/react/commit/3285d834402a60d241188a1deacf8250b50239cf - لـ https://github.com/facebook/react/blob/master/CHANGELOG.md#react -9

التعليق الأكثر فائدة

لأي شخص يبحث عن حل بديل ، يمكنك استخدام e.persist()

على سبيل المثال return <input onChange={e => handleChange(e.persist()||e)} />

ال 3 كومينتر

لأي شخص يبحث عن حل بديل ، يمكنك استخدام e.persist()

على سبيل المثال return <input onChange={e => handleChange(e.persist()||e)} />

هذا بسبب كيفية عمل debounce. سيستخدم setTimeout لدفع مكالمة إلى حلقة الحدث التالية. كما أشرت ، يعني هذا بسبب التجميع أن React قد أعادت بالفعل الحدث الاصطناعي إلى التجمع وأعد ضبط الحقول. إذا كنت تستخدم debounce أو أي شيء آخر يتطلب وجود الحدث خارج معالج حدث React (على سبيل المثال ، رمز غير متزامن) ، فأنت بحاجة إلى الاستمرار.

هذا حسب التصميم لذا لا يوجد ما يمكن فعله حيال هذا الآن. هناك بعض النقاش في # 6190 حول احتمال إزالة التجميع ، والذي يجب أن يجعل التعليمات البرمجية الخاصة بك تعمل دون الإصرار الصريح.

هذا يتعارض مع المبادئ ذاتها التي يتم الرد عليها لحل مشكلة تدفق البيانات والثبات وتجنب الآثار الجانبية. أنت تقوم بتمرير كائن إلى أحد المكونات ، لكنها مجرد لقطة يجب استخدامها في نفس حلقة الحدث لأنك لا تثق في GC والمستخدمين الذين قد يتسببون عن غير قصد في حدوث تسرب ...

في حين أنها قد تكون فكرة جيدة في ذلك الوقت ، يحتاج البعض منا فقط إلى دعم المتصفحات دائمة الخضرة القادرة على توفير GC المناسب. ربما ، في غضون ذلك أثناء إعادة النظر في هذا النهج ، يمكن تعيين var flag / env لإيقاف التجميع.

هل كانت هذه الصفحة مفيدة؟
0 / 5 - 0 التقييمات