LWC चाइल्ड कैश डेटा बासी @wired एपेक्स क्वेरी द्वारा, पेरेंटसएपलेक्स () को क्वैसेलेक्टर () द्वारा बच्चे पर रीफ्रेश नहीं कर सकता क्योंकि यदि बच्चा छिपा हुआ है: सच। क्या करें?
संक्षिप्त ऐप संरचना (चित्र देखें): दाईं ओर "लाइन आइटम" चाइल्ड घटकों की सूची (इस तस्वीर पर सिर्फ एक 1601xCC5Bulk), बाईं ओर पैलेट के साथ कंटेनर। << आबंटित बीटीएन एक फॉर्म के साथ एक और चाइल्ड मोडल खोलता है (यदि: सच है ..) इस फॉर्म की पिकलिस्ट केवल खाली पैलेट दिखाने के लिए @wire एपेक्स का उपयोग करती है, इसलिए यह डीएमएल के बाद फॉर्म के कंट्रोलर द्वारा ही रिफ्रेश की जाती है।
समस्या तब उत्पन्न होती है जब उदाहरण के लिए माता-पिता द्वारा पैलेट की राशि को बदलते हुए दाईं ओर लाल बटन का उपयोग किया जाता है। यह DML पैलेट के साथ कंटेनर को हटा देता है।
लेकिन अगर छिपे हुए रूप को फिर से खोला जाता है, तो पुराने फूस के मान अभी भी पिकलिस्ट मान के रूप में मौजूद हैं, मुझे उस डेटा को ताज़ा करने की आवश्यकता है। लेकिन यह बच्चा छिपा हुआ है, इसलिए मानक द्वारा पहुंच से बाहर है: माता-पिता -> क्वेरीसेलर (बच्चा 2) .मिथोड)
- नए प्रश्न के लिए क्षमा करें: क्या छिपे हुए घटक के तरीकों तक पहुंचने का एक तरीका है?
- मैं मूल घटक (आसान ट्रिगर) के लिए एपेक्स क्वेरी को कॉल को स्थानांतरित करने के बारे में भी सोच रहा था, फिर इसे एक एपीआई तर्क के रूप में चाइल्ड मोडल के पास भेज रहा हूं, इसलिए जब मोडल प्रकट होता है तो इसे अपडेट किया गया डेटा मिलेगा। ऐसा करना थोड़ा गलत लगता है, क्योंकि माता-पिता बच्चे का बोझ उठाते हैं। (शायद मैं गलत हूं)
- मैं उस सर्वोच्च क्वेरी के लिए बच्चे के रेंडरकॉलबैक का उपयोग करने के बारे में भी सोच रहा था, लेकिन अनंत रेंडर लूप्स से डरता हूं?
- AuraEnabled एपेक्स के कैशिंग को अक्षम करना एक अच्छी बात होगी, लेकिन यह असंभव लगता है।
यहाँ नंगे हड्डियों का मार्कअप है, जिसमें केवल सभी शामिल हिस्से हैं
=== PARENT (2 बच्चों के साथ) ===
एचटीएमएल
<template for:each={lineItems.data} for:item="lineItem">
<lightning-layout-item key={lineItem.Id} size="12">
<c-packing-list-line-item-card lineitem={lineItem} onallocatebuttonpress={openAllocationModal}></c-packing-list-line-item-card>
</lightning-layout-item>
</template>
<template if:true={isLineItemModalOpen}>
<c-packing-list-allocation-modal recordid={recordId} oncloseallocationmodal={closeAllocModal} onproductallocated={refreshData}></c-packing-list-allocation-modal>
</template>
जे एस
openAllocationModal(e) {
this.editItemId = e.detail;
this.isLineItemModalOpen = true;
}
closeAllocModal() {
this.isLineItemModalOpen = false;
}
=== CHDD 1: पैकिंग-सूची-लाइन-आइटम-कार्ड === (दाईं ओर, उत्पाद विवरण दिखाते हुए, आईडी आईडी को मोडल करता है)
एचटीएमएल
<lightning-button variant="brand" label="<< Allocate" data-itemid={lineitem.Id} onclick={openAllocationModal}></lightning-button>
जे एस
openAllocationModal(e) {
const selectEvent = new CustomEvent('allocatebuttonpress', { detail: e.target.dataset.itemid });
this.dispatchEvent(selectEvent);
}
=== CHILD 2: आवंटन मोडल (सशर्त प्रदर्शन) ===
एचटीएमएल
<template if:true={showInsertButton}>
<button class="slds-button slds-button_brand" onclick={handleAllocationInsert}>Insert</button>
</template>
जेएस (आप शायद केवल क्लोजमॉडल में रुचि रखते हैं () {}, अन्य सामान पूर्णता के लिए है)
handleAllocationInsert() {
[...]
createRecord(recordInput)
.then((allocId) => {
this.showToast('success', 'Success', 'Product Allocated');
this.handleInsert(this.palletValue);
this.refreshPallets();
})
.catch((error) => {
this.showToast('error', 'Error creating record', error.body.message);
this.closeModal();
});
}
closeModal() {
// On save parent closes modal
console.log('closing 1');
const selectEvent = new CustomEvent('closeallocationmodal');
this.dispatchEvent(selectEvent);
this.spinner = false;
}
handleInsert(palletValue) {
// On save parent refreshes container view
const selectEvent = new CustomEvent('productallocated', {
detail: this.palletcontainers[palletValue].containerId
});
this.dispatchEvent(selectEvent);
this.closeModal();
}
जवाब
नए प्रश्न के लिए क्षमा करें: क्या छिपे हुए घटक के तरीकों तक पहुंचने का एक तरीका है?
नहीं, बच्चे को डोम से शारीरिक रूप से हटा दिया गया है और अब बिल्कुल मौजूद नहीं है (संभवतः एक घटक कैश में छोड़कर)।
मैं मूल घटक (आसान ट्रिगर) के लिए एपेक्स क्वेरी को कॉल को स्थानांतरित करने के बारे में भी सोच रहा था, फिर इसे एक एपीआई तर्क के रूप में चाइल्ड मोडल के पास भेज रहा हूं, इसलिए जब मोडल प्रकट होता है तो इसे अपडेट किया गया डेटा मिलेगा। ऐसा करना थोड़ा गलत लगता है, क्योंकि माता-पिता बच्चे का बोझ उठाते हैं। (शायद मैं गलत हूं)
यह वास्तव में ऐसा करने का एक बहुत ही मानक तरीका है। बच्चे को केवल डेटा दिखाने के बारे में चिंता करने की ज़रूरत है, जो कि ऐसा करने के लिए डिज़ाइन किया गया है। यह आमतौर पर घटक पदानुक्रम में जितना संभव हो उतना डेटा प्राप्त / सेट करने के लिए एक अच्छा विचार है (लेकिन आवश्यक से अधिक नहीं)।
मैं उस सर्वोच्च क्वेरी के लिए बच्चे के रेंडरकॉलबैक का उपयोग करने के बारे में भी सोच रहा था, लेकिन अनंत रेंडर लूप्स से डरता हूं?
बुरा विचार, आप अनंत छोरों को प्राप्त करेंगे, जैसा कि आप उम्मीद करते हैं। हालांकि, घटक के कनेक्टकॉलबैक का उपयोग करने से यहां समझ में आ सकती है। इस घटना को केवल तब कहा जाता है जब एक घटक को डोम में स्थानांतरित अयस्क जोड़ा जाता है, इसलिए इसमें अनंत लूप की समस्याएं नहीं होंगी।
AuraEnabled एपेक्स के कैशिंग को अक्षम करना एक अच्छी बात होगी, लेकिन यह असंभव लगता है।
यह पूरी तरह से संभव है, लेकिन मैं इसे अंतिम उपाय मानूंगा। अधिकांश समय, डेटा तब तक नहीं बदलता है जब तक उपयोगकर्ता कुछ नहीं करता है, इसलिए कैशिंग प्रदर्शन में सुधार कर सकता है। उस ने कहा, आपके डिज़ाइन को भी लगातार कॉल की आवश्यकता नहीं है, इसलिए कैशिंग अक्षम करना संभवतः भी स्वीकार्य है।
अंत में, मैं कहूंगा कि माता-पिता से डेटा को नियंत्रित करना सबसे आसान समाधान होगा। यह भी ज्यादातर मामलों में आम तौर पर स्वीकार्य समाधान है, क्योंकि बाल घटक आमतौर पर केवल उस डेटा के साथ काम करते हैं जो वे माता-पिता से दिए गए हैं। उदाहरण के लिए, lightning-inputसर्वर के साथ कुछ भी सीधे नहीं करता है, लेकिन घटनाओं के माध्यम से माता-पिता में परिवर्तन संचार करता है। यह उपयोग करने के लिए एक पूरी तरह से प्राकृतिक डिजाइन है।
यदि आप चाहते हैं कि बच्चे काम करना जारी रखें, तो यह ठीक है, बस, आपके कनेक्टेड कॉलबैक में एक ताज़ा करें कॉल या कैशिंग अक्षम करें। या तो आपको अपनी समस्या का समाधान करना चाहिए, हालाँकि आप एक बड़े डेटा सेट पर परीक्षण कर सकते हैं कि यह देखने के लिए कि आपके पास कौन से विकल्प उपलब्ध हैं, सर्वश्रेष्ठ प्रदर्शन प्रदान करते हैं।