मैं अपने nuxt-ऐप में एक ब्लॉग बना रहा हूं जो कंटेंटफुल से डेटा खींचता है ट्यूटोरियल, अब मैं यह सब ठीक कर सकता हूं, लेकिन मुझे लगता है कि asyncData तर्क

मैंने इस तरह एक जेसन फाइल बनाई है ..

.contentful.json

{
  "CTF_BLOG_POST_ITEM": "...",
  "CTF_BLOG_POST": "...",
  "CTF_SPACE_ID": "...",
  "CTF_CDA_ACCESS_TOKEN":"..."
}

और फिर मेरे nuxt.config.js . में

env: {
   CTF_SPACE_ID: config.CTF_SPACE_ID,
   CTF_CDA_ACCESS_TOKEN: config.CTF_CDA_ACCESS_TOKEN,
   CTF_BLOG_POST_ITEM: config.CTF_BLOG_POST_ITEM,
   CTF_BLOG_POST: config.CTF_BLOG_POST
}

अब मूल रूप से मेरे घटक में मैं ऐसा करने की कोशिश कर रहा हूं

asyncData(context, {env}) {
    return Promise.all([
        client.getEntries({
            'content_type': env.CTF_BLOG_POST_ITEM,
            order: '-sys.createdAt'
        })
    ]).then(([posts]) => {
        console.log(context);
        return {
            posts: posts.items
        }
    })
},

लेकिन जब मैं इसे चलाता हूं तो मुझे cannot read property CTF_BLOG_POST_ITEM of undefined मिलता है, अगर मैं तर्कों से संदर्भ लेता हूं तो यह काम करता है, और इसके विपरीत अगर मैं {env} लेता हूं तो मुझे संदर्भ मिलता है।

मैं दोनों कैसे प्राप्त कर सकता हूँ ??

धन्यवाद

2
Smokey Dawson 7 फरवरी 2019, 06:25

1 उत्तर

सबसे बढ़िया उत्तर

asyncData() का प्राथमिक (पहला) तर्क संदर्भ वस्तुenv प्रसंग वस्तु का गुण है। आप इसे ऑब्जेक्ट रीस्ट्रक्चरिंग असाइनमेंट। ऑब्जेक्ट रीस्ट्रक्चरिंग असाइनमेंट के उपयोग के बिना आपका उदाहरण निम्नलिखित तरीके से फिर से लिखा जा सकता है:

asyncData(context) {
    return Promise.all([
        client.getEntries({
            'content_type': context.env.CTF_BLOG_POST_ITEM,
            order: '-sys.createdAt'
        })
    ]).then(([posts]) => {
        console.log(context);
        console.log(context.env);
        return {
            posts: posts.items
        }
    })
},

हस्ताक्षर asyncData(context, {env}) { गलत है क्योंकि आप दूसरा तर्क जोड़ रहे हैं, {env}, जो किसी भी तरह से उपरोक्त संदर्भ वस्तु का संदर्भ नहीं देता है। अगर आपको context से केवल env की आवश्यकता है, तो आप ऑब्जेक्ट रीस्ट्रक्चरिंग असाइनमेंट इस गुण को निम्न तरीके से निकालने के लिए (जैसा कि आपने पहले तर्क को हटाते समय काम का उल्लेख किया था:

 asyncData({env}) {
    return Promise.all([
        client.getEntries({
            'content_type': context.env.CTF_BLOG_POST_ITEM,
            order: '-sys.createdAt'
        })
    ]).then(([posts]) => {
        console.log(context);
        console.log(context.env);
        return {
            posts: posts.items
        }
    })
},

यदि आपको ऑब्जेक्ट विनाशकारी असाइनमेंट का उपयोग करके अतिरिक्त संदर्भ ऑब्जेक्ट गुणों की आवश्यकता है। टीटी की तरह दिखेगा:

asyncData({env, params, req, res}) {

अन्यथा, आप केवल context को पुनर्गठन के साथ प्रथम/प्राथमिक तर्क के रूप में पास करके context.env, context.params, आदि जैसे गुणों तक पहुंच सकते हैं।

उम्मीद है कि यह मदद करता है!

2
Alexander Staroselsky 7 फरवरी 2019, 06:47