NUXT asyncData刷新页面不执行

Question

最近刚玩nuxt,有一个问题没懂问问各位大神，页面强制刷新asyncData是不会执行的，为什么数据请求要放在asyncData里

Answer 1

asyncData是一个两用方法。可以在函数内部设置一个consolo.log('triggered')验证：

1. 当强制刷新页面时，asyncData在服务端运行，在运行结束后拼装成页面返给你，类似jsp。所以，在刷新下，浏览器的console.log是不会打印任何东西的，但是在node的运行终端你可以看到console.log的结果；
2. 当VUE项目内部用nuxt-link跳转时，它运行浏览器中。类似在普通vue页面中的mouted或者哪个钩子函数里写请求一样；这个时候，在asyncData里的consolelog会打印在浏览器端；

asyncData在服务器端运行是为了满足SEO和减少HTTP请求；
asyncData在浏览器端运行是为了满足正常的异步请求。

Answer 2

执行了。。。你可以把生命周期每个方法打印出来，其实都执行了，只不过asyncData和fetch是在服务端打印出来的。。。你在浏览器的console里看不到

Answer 3

刷新页面的时候，服务端执行asyncData预取数据。数据随页面返回，在前端，不会执行asyncData函数。数据请求在asyncData主要是为了可以写通用代码吧

Answer 4

这个问题解决了没？

Answer 5

我也萌新刚学到这里，要不请求还是放到vue的created钩子里面？

··

我知道了asyncData 就是服务端渲染之前执行， 渲染之后 刷新页面并不会在走服务端请求了，所以不会执行这个。
但是数据还是渲染到页面上了， 看你是 渲染页面之前拿数据， 还是渲染之后拿数据吧，看情况使用

Answer 6

请问解决了吗 我也碰到了这个问题

Answer 7

网址： www.gd277217.com/nuxt/asyncData/asyncData.html