nuxtjs asyncData fetch失效不起作用的原因

2020-03-12 22:49:36

调试新nuxtjs工程,水涌asyncData,竟然不起作用,写错误代码也不报错。这可急刹我啦。大晚上七点半就做这,这个时候才解决。你看这篇文章可能需要三分钟,我在这折磨了三小时。

一直以为我框架那里设置出了问题呢。


哎,文档有句话,不可以在子组件中使用,只能是page目录下使用,(多看一眼官方文档你就不会问这个问题了!!!)


真恶心啊,后来想想也是这个事,组件咋给你渲染,展示不展示还是一会事呢。日了狗了。


虽说组件不能够后台渲染了,但是我发现在created中出现的数据,如果不是异步啥的,会玩玩正正的在后端渲染的,不影响哦。

那具体在哪里改用什么,就看自己的需要了。


关于如何在组件中使用异步数据?下面是官网给出的答案。我觉得完全可以用crated解决,

如果组件不是和路由绑定的页面组件,原则上是不可以使用异步数据的。因为 Nuxt.js 仅仅扩展增强了页面组件的 data 方法,使得其可以支持异步数据处理。

对于非页面组件,有两种方式可以实现数据的异步获取:

  1. 在组件的 mounted 方法里面实现异步获取数据的逻辑,之后设置组件的数据,限制是:不支持服务端渲染。

  2. 在页面组件的asyncDatafetch方法中进行API调用,并将数据作为props传递给子组件。服务器渲染工作正常。缺点:asyncData或页面提取可能不太可读,因为它正在加载其他组件的数据。 总之,使用哪种方法取决于你的应用是否需要支持子组件的服务端渲染。


nuxtjs的生命周期,都应该怎么使用,下面附属一篇文章。

nuxtjs踩坑指南


初识不知曲中意,再听已是曲中人。

但是我的vue文件就在page目录下呢,也不行。 哎,原来人家不管你是在page下还是哪,人家的意思是你是要有page属性的,你在page目录下,你改是模版你还是模版。

怪不得非得有一个component文件夹,我本以为我自己在page目录下面建一个子类文件夹,放我的page子组件挺规正的,哎,还是老把式的房子component下面吧把组件。

  • 2021-04-15 10:11:17

    Puppeteer拦截修改返回值

    page.setRequestInterception(true)拦截器的使用方法和场景 现附上Puppeteer的Api的链接https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md

  • 2021-04-15 10:32:18

    怎么给 headless chrome添加cookies

    In puppeter you have access to the session cookies through page.cookies(). So once you log in, you could get every cookie and save it in a json file:

  • 2021-04-15 10:51:21

    如何通过Devtools协议拦截和修改Chrome响应数据

    在日常研究中,我们经常碰到大量JavaScript代码,我们首先要深入分析才能了解这些代码的功能及具体逻辑。这些代码代码可能会被恶意注入到页面中,可能是客户送过来需要我们帮忙分析的脚本,也可能是我们的安全团队在网页上找到的引用了我们服务的某些资源。这些脚本通常代码量不大、经过混淆处理,并且我们总是需要经过多层修改才能继续深入分析。

  • 2021-04-19 10:54:39

    block和delegate的区别

    代理 可读性高 大部分可以属性 block 写的代码少 一般作为参数 通知 占用资源

  • 2021-04-19 11:00:23

    浅谈block和delegate的使用

    委托是协议的一种,顾名思义,就是委托他人帮自己去做事。委托是给一个对象提供机会对另一个对象中的变化做出反应或者影响另一个对象的行为。其基本思想是:两个对象协同解决问题,并且打算在广泛的情形中重用。委托指向另一个对象(即它的委托)的引用,并在关键时刻给委托发消息。消息可能只是通知委托发生了某件事情,给委托提供机会执行额外的处理,或者消息可能要求委托提供一些关键的信息以控制所发生的事情。委托的作用主要有两个,一个是传值,一个是传事件。

  • 2021-04-19 11:36:44

    iOS 组件实现方案

    什么才是好架构,为什么要组件,组件设计的优点

  • 2021-04-25 09:53:18

    android debug速度特别慢有时候卡住

    一直提示定在 Starting LLDB server。可能的原因是 Android Studio编译速度太慢了,就会一直卡在Starting LLDB server。可以通过设置 Run/Debug Configurations ——> Debugger ——> Debug type 为 Java 跳过 C/C++的调试,起码实现对 Java 程序的调试