वस्तु संभवतः 'अशक्त' है। एक रेफरी (अशक्त) पर
लर्निंग वीयू कम्पोज़िशन एपीआई (और टाइपस्क्रिप्ट), मुझे मिले डॉक्स से, ref(null)
मुझे अपने अंदर एक सब कम्पोनेंट का उपयोग करने के लिए होना चाहिए <template>...</template>
।
इस उपसमुच्चय की तरह तरीके हैं open()
, और मैं इसे इस तरह एक्सेस कर रहा हूं:
setup() {
const subcomponentRef= ref(null);
subcomponentRef.value.open();
return { subcomponentRef };
}
यह मैं मानता हूं कि Object is possibly 'null'.
इंगित की गई त्रुटि दिखा सकती है subcomponentRef.value
, लेकिन अजीब बात यह है कि अगर मैंने एक शर्त जोड़ी है if (subcomponentRef !== null && subcomponentRef.value !== null) { ... }
, तो यह अभी भी उस त्रुटि को दिखाता है। क्यों??
साथ ही इसे एक्सेस करने की कोशिश की, subcomponentRef?.value?.open()
लेकिन मुझे यह त्रुटि मिली Property 'open' does not exist on type 'never'.
।
इसके अलावा, एक गैर-शून्य अभिकथन को जोड़ने की कोशिश की , जैसे confirmation.value!.open();
और एक ही त्रुटि प्राप्त करता है Property 'open' does not exist on type 'never'.
।
किसी भी विचार यहाँ क्या गलत है? या शायद उपयोग करने के बजाय ref(null)
, मुझे इसे वास्तविक घटक के साथ पूर्वनिर्धारित करना चाहिए? लेकिन मुझे नहीं पता कि इसे सही तरीके से कैसे किया जाए, डॉक्स में नहीं पाया जा सकता।
जवाब
बड़ा अच्छा सवाल! मेरे पास आपके पास एक ही मुद्दा था और इस जवाब पर अड़ गया । मेरे लिए जो काम किया गया वह ऑब्जेक्ट के आकार (एक टाइपस्क्रिप्ट इंटरफ़ेस) को परिभाषित कर रहा था, इसलिए टीएस जानता है कि क्या है और क्या नहीं है।
इस ज्ञान को अपने उदाहरण पर लागू करना:
setup() {
const subcomponentRef = ref(null)
subcomponentRef.value.open() // TS error here
}
हो जाता है:
setup() {
const subcomponentRef = ref<null | { open: () => null }>(null)
subcomponentRef.value?.open()
}
TS त्रुटि अब चली गई है क्योंकि:
- टाइपस्क्रिप्ट जानता है कि फ़ंक्शन
open
उपलब्ध हैsubcomponentRef
क्योंकि हमने इसे अग्रिम घोषित किया था - वैकल्पिक श्रृंखलन के साथ हम टाइपस्क्रिप्ट को बताते हैं कि आगे क्या
subcomponentRef.value
हैnull
या नहींundefined
।
आमतौर पर ये इंटरफेस पहले से ही कहीं न कहीं उपलब्ध कराए जाते हैं और इन्हें मैनुअली बनाने की जरूरत नहीं होती है। तो मेरे मामले में मुझे बस टीएस की त्रुटि से बचने के लिए QInput
इंटरफ़ेस का उपयोग करना था, जो उपलब्ध नहीं है:quasar
resetValidation
import { QInput } from 'quasar'
const driverIdInput = ref<QInput>()
driverIdInput.value?.resetValidation()
मुझे आशा है कि इससे चीजों को साफ करने और इन खराब त्रुटियों से बचने में मदद मिलेगी।
आपको घटक प्रकार का उपयोग करना चाहिए typeof yourComponent
या null
फिर ?
विधियों / गुणों का उपयोग करने के लिए उपयोग करना चाहिए :
setup() {
const subcomponentRef= ref < typeof subcomponent| null > (null);
subcomponentRef.value?.open();
return { subcomponentRef };
}