क्या मानचित्र पर सेट प्रतिक्रिया प्रतिक्रियाशीलता और डेटा प्रकार सेट करें?

Question

Vue.js के लिये दस्तावेज स्मार्ट ऑटो परिवर्तन ट्रैकिंग सादे जावास्क्रिप्ट के लिए वस्तुओं का उल्लेख:

जब आप एक सादे जावास्क्रिप्ट वस्तु अपने डेटा विकल्प के रूप में एक Vue उदाहरण के पास, Vue.js चलना होगा इसके सभी गुणों के माध्यम से और उन्हें Object.defineProperty का उपयोग कर गेटर/सेटर्स में परिवर्तित करें।

के बाद से जावास्क्रिप्ट के Map और Set डेटाटाइप्स उनके में निर्मित get/set तरीकों के साथ उपयोग के लिए डिज़ाइन कर रहे हैं, मैं Vue Map और Set की आंतरिक स्थिति के लिए कॉल (और इसलिए, परिवर्तन) ट्रैक करने के लिए कैसे प्राप्त कर सकते हैं रों?

Answer 1

Vue.js Map और Set डेटा प्रकारों (अभी तक?) पर प्रतिक्रियाशीलता का समर्थन नहीं करता है।

सेट और मानचित्र Vue द्वारा नमूदार नहीं हैं:

feature ticket कुछ चर्चा और चारों ओर इस काम (उपयोगकर्ता "इंका" द्वारा) है। उन लोगों का उपयोग करने के लिए - या तो v-for में, या गणना की गई गुणों, विधियों, निरीक्षक, टेम्पलेट अभिव्यक्तियों आदि में - आपको इस संरचना के एक क्रमिक प्रतिकृति बनाने और इसे Vue पर बेनकाब करने की आवश्यकता है।

data() { 
    mySetChangeTracker: 1, 
    mySet: new Set(), 
}, 

computed: { 
    mySetAsList() { 
    // By using `mySetChangeTracker` we tell Vue that this property depends on it, 
    // so it gets re-evaluated whenever `mySetChangeTracker` changes 
    return this.mySetChangeTracker && Array.from(this.mySet); 
    }, 
}, 

methods: { 
    add(item) { 
    this.mySet.add(item); 
    // Trigger Vue updates 
    this.mySetChangeTracker += 1; 
    } 
} 

यह गैर नमूदार डेटा प्रतिक्रियाशील बनाने के लिए एक थोड़े hacky लेकिन 100% काम कर रहे विधि दिखाता है: यहाँ एक अनुभवहीन उदाहरण जो जानकारी के साथ उपलब्ध कराने के Vue कि Set है अद्यतन के लिए एक सरल काउंटर का उपयोग करता है। फिर भी, असली दुनिया के मामलों में मैंने को सेट्स/मैप्स के क्रमबद्ध संस्करणों के साथ समाप्त किया (उदाहरण के लिए आप शायद स्थानीय स्टोरेज में सेट/मैप्स के संशोधित संस्करणों को स्टोर करना चाहते हैं और इस प्रकार वैसे भी उन्हें क्रमबद्ध करें), इसलिए कोई कृत्रिम काउंटर/हैक नहीं शामिल थे।