как получить контекст и переменные env в asyncData nuxtjs

Question

Я создаю блог в своем nuxt-приложении, которое извлекает данные из содержательного контента. Я следовал этому учебнику , теперь я могу все понять, но не могу понять и контекст, и окружающую среду.Переменные, которые я настроил для возврата из аргумента asyncData

Я создал файл json следующим образом:

.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}, я получаю контекст.

Как я могу получить оба ??

Спасибо

Answer 1

Основной (1-й) аргумент asyncData () - это объект контекста .env является свойством объекта контекста.Вы можете получить к нему доступ как context.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}, который не ссылается навышеупомянутый объект контекста любым способом.Если вам нужно только env из context, вы можете использовать присваивание реструктуризации объекта , чтобы извлечь это свойство следующим образом (как вы упомянули, работает при удалении 1-го аргумента:

 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
        }
    })
},

Если вам нужны дополнительные свойства объекта контекста с использованием назначения деструктуризации объекта. Tt будет выглядеть так:

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

В противном случае вы можете просто получить доступ к таким свойствам, как context.env, context.params и т. Д., Простопередача context в качестве первого / основного аргумента при реструктуризации.

Надеюсь, это поможет!