Как получить доступ к данным в mounted () с помощью nuxt.js
Я попытался сделать цикл for внутри функции mounted() с помощью nuxt.js. Данные, которые я пытался зациклить, были вызваны с помощью axios in created (), но когда я регистрирую данные в created() Я получаю этот объект:
[__ob__: Observer]
установленный:
mounted() {
// creating FeaturedCasinos
for(let i = 0; i > this.casinos.length; i++) {
console.log("loop")
if(this.casinos[i].brand_tags[2].Brand_Tag_Name = "Featured") {
this.featuredCasinos.push(this.casinos[i]);
}
}
},
созданный:
created() {
return axios.get("http://xxx.xxx.xxx.xx/casinos/").then(res2 => (this.casinos = res2.data))
}
РЕДАКТИРОВАТЬ:
asyncData({ params }) {
return axios.get(casinoURL + params.casinos).then(res => {
return {
casino: res.data,
casinoID: res.data[0].id,
casinoBonus: res.data[0].bonuses,
casinoPros: res.data[0].brand_pros,
casinoCons: res.data[0].brand_cons,
casinoGames: res.data[0].verticals,
casinoTags: res.data[0].brand_tags,
casinoPayments: res.data[0].payment_methods,
casinoDeposits: res.data[0].Deposit_Methods,
casinoWithdrawals: res.data[0].Withdrawal_Methods,
casinoLanguages: res.data[0].languages,
casinoGamingProvider: res.data[0].gaming_provider,
casinoAnswers: res.data.map(item => { return {FAQ_Answer_One:item.FAQ_Answer_One, FAQ_Answer_Two:item.FAQ_Answer_Two, FAQ_Answer_Three:item.FAQ_Answer_Three, FAQ_Answer_Four:item.FAQ_Answer_Four, FAQ_Answer_Five:item.FAQ_Answer_Five, FAQ_Answer_Six:item.FAQ_Answer_Six}})
};
})
},
asyncData({ params }) {
return axios.get("http://xxx.xxx.xxx.xx/casinos/").then(res2 => {
return { casinos: res2.data }
});
},
Ответы - Как получить доступ к данным в mounted () с помощью nuxt.js / How to access data in mounted() with nuxt.js

07.09.2020 12:38:49
Согласно документации:
У вас нет доступа к экземпляру компонента через это внутри asyncData, потому что он вызывается перед инициализацией компонента.
Поэтому вместо этого в asyncData
вы должны вернуть данные, которые будут объединены с данными компонента в качестве объекта:
asyncData({ params }) {
return axios.get("http://xxx.xxx.xxx.xx/casinos/").then(res2 => {
return { casinos: res2.data }
}
}
Редактировать: в этом новом случае после того, как вы отредактировали вопрос, который вы должны удалить один из asyncData
и получения унифицированных данных. Вы можете использовать синтаксис async/await, чтобы сделать код более понятным и легким для чтения:
asyncData({ params }) {
const res = await axios.get(casinoURL + params.casinos)
const res2 = await axios.get("http://xxx.xxx.xxx.xx/casinos/")
return {
casino: res.data,
casinoID: res.data[0].id,
casinoBonus: res.data[0].bonuses,
casinoPros: res.data[0].brand_pros,
casinoCons: res.data[0].brand_cons,
casinoGames: res.data[0].verticals,
casinoTags: res.data[0].brand_tags,
casinoPayments: res.data[0].payment_methods,
casinoDeposits: res.data[0].Deposit_Methods,
casinoWithdrawals: res.data[0].Withdrawal_Methods,
casinoLanguages: res.data[0].languages,
casinoGamingProvider: res.data[0].gaming_provider,
casinoAnswers: res.data.map(item => { return {FAQ_Answer_One:item.FAQ_Answer_One, FAQ_Answer_Two:item.FAQ_Answer_Two, FAQ_Answer_Three:item.FAQ_Answer_Three, FAQ_Answer_Four:item.FAQ_Answer_Four, FAQ_Answer_Five:item.FAQ_Answer_Five, FAQ_Answer_Six:item.FAQ_Answer_Six}})
casinos: res2.data
}
}