example.vue
<template><div>{{person.name}}</div></template>
<script>
export default{
data(){
return {person: {name: null}}
},
asyncData(){
return axios.get('/user/id')
}
}
</script>
The key point is when nuxt.render has data parameter then don't excute the asyncData method, directly assigning the parameter of data to example.vue's data. Like this
//Koa2 env
app.get('/user/:id', async ctx=>{
const data = {person: await mongoose.user.findById(ctx.params.id)}
//If can't find the person, nuxt render 404 page.
nuxt.render(req, res, data)
});
In this case can save a little network request overhead
<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c597">#c597</a>)</em></sub></div>