React-tags: इनपुट घटक पर चेतावनी

को निर्मित 18 सित॰ 2018 · 7टिप्पणियाँ · स्रोत: i-like-robots/react-tags

मुझे ReactTags का उपयोग करके चेतावनी मिल रही है:

Warning: Failed prop type: You provided a `value` prop to a form field without an `onChange` handler. This will render a read-only field. If the field should be mutable use `defaultValue`. Otherwise, set either `onChange` or `readOnly`.
    in input (created by Input)
    in div (created by Input)
    in Input (created by ReactTags)
    in div (created by ReactTags)
    in div (created by ReactTags)

यहाँ जो कहा गया है उससे हमें शायद https://github.com/i-like-robots/react-tags/blob/master/lib/Input.js#L78 कुछ इस तरह से बदलना चाहिए:
defaultValue={query}

तुम क्या सोचते हो?
धन्यवाद!

bug unconfirmed

स्रोत

luciemac

👍13

सबसे उपयोगी टिप्पणी

मैंने डिफ़ॉल्ट वैल्यू में बदलने के लिए एक पीआर जोड़ा है, लेकिन यदि आप एक हैक चाहते हैं जो चेतावनी से बचा जाता है जब तक कि यह तय नहीं हो जाता है, तो आप अपनी कक्षा में एक नोप विधि जोड़ सकते हैं जो रिएक्टटैग का उपयोग करता है और इसे आपके घटक के लिए ऑनचेंज के रूप में संदर्भित करता है। यह बदसूरत है, लेकिन यह चेतावनियों को रोक देगा।

noOp() {
    // does nothing
}

<ReactTags
tags={this.state.tags}
suggestions={this.state.suggestions}
handleAddition={this.handleTagAddition}
handleDelete={this.handleTagDelete}
inputAttributes={{ onChange: this.noOp }}
/>

chellman 12 अक्तू॰ 2018

👍2

सभी 7 टिप्पणियाँ

मुझे एक ही समस्या है, कोई सुझाव?

gustavohornig 2 अक्तू॰ 2018

मुझे डर है कि मैंने इसे स्वयं नहीं देखा है, क्या आप मुझे बता सकते हैं कि आप किस रिएक्ट संस्करण का उपयोग कर रहे हैं?

i-like-robots 5 अक्तू॰ 2018

मैं प्रतिक्रिया 16.3.2 का उपयोग कर रहा हूँ

luciemac 5 अक्तू॰ 2018

@ i-like-robots मुझे भी यह समस्या हो रही है।

estherleah 11 अक्तू॰ 2018

👍2

noOp() {
    // does nothing
}

<ReactTags
tags={this.state.tags}
suggestions={this.state.suggestions}
handleAddition={this.handleTagAddition}
handleDelete={this.handleTagDelete}
inputAttributes={{ onChange: this.noOp }}
/>

chellman 12 अक्तू॰ 2018

👍2

यह एक दिलचस्प मुद्दा है, कुछ साल पहले https://github.com/facebook/react/issues/1118 में इस पर विस्तार से चर्चा की गई थी (हालांकि मैंने यह चेतावनी कभी नहीं देखी है, 16.3.2 सहित रिएक्ट के किसी भी संस्करण के साथ! )

वर्तमान कार्यान्वयन के साथ तकनीकी रूप से _गलत_ कुछ भी नहीं है, लेकिन मैं मानता हूं कि कंसोल को अव्यवस्थित करने वाली चेतावनियां कष्टप्रद हैं और इससे बचा जाना चाहिए।

मुझे यकीन नहीं है कि defaultValue करना सही समाधान है क्योंकि इसके अनपेक्षित परिणाम हो सकते हैं (देखें https://github.com/i-like-robots/react-tags/pull/139#issuecomment-431006214 ) लेकिन संभावित रूप से कई अन्य समाधान उपलब्ध हैं।

i-like-robots 18 अक्तू॰ 2018

इसे और अधिक देखने पर मैं देख सकता हूं कि इस चेतावनी में 5 शर्तें हैं:

https://github.com/facebook/react/blob/b87aabdfe1b7461e7331abb3601d9e6bb27544bc/packages/react-dom/src/shared/ReactControlledValuePropTypes.js#L32 -L46

यह पहली शर्त है जो मुझे रूचि देती है क्योंकि डिफ़ॉल्ट रूप से यह _ चाहिए_ true मूल्यांकन करता है क्योंकि state.query लिए डिफ़ॉल्ट मान एक खाली स्ट्रिंग है। इसलिए यह फ़ंक्शन को जल्दी वापस आने का कारण बनना चाहिए और चेतावनी को आउटपुट नहीं करना चाहिए।

इसलिए इस चेतावनी को ट्रिगर करने के लिए मुझे डिफ़ॉल्ट स्थिति को बदलना पड़ा (https://github.com/i-like-robots/react-tags/blob/master/lib/ReactTags.js#L35) इसे एक वास्तविक मूल्य बनाने के लिए।

क्या आप में से किसी के पास एक उदाहरण है जो इस मुद्दे को प्रदर्शित करता है ताकि मैं इसे और अधिक बारीकी से देख सकूं?

i-like-robots 18 अक्तू॰ 2018

क्या यह पृष्ठ उपयोगी था?

0 / 5 - 0 रेटिंग्स

React-tags: इनपुट घटक पर चेतावनी

सबसे उपयोगी टिप्पणी

सभी 7 टिप्पणियाँ

संबंधित मुद्दों