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下面吧把组件。

  • 2019-09-03 23:09:17

    Linux下静态库(.a)和动态库(.so) 的生成与使用以及区别

    静态库在程序编译时会被连接到目标代码中,程序运行时将不再需要该静态库。 动态库在程序编译时并不会被连接到目标代码中,而是在程序运行是才被载入,因此在程序运行时还需要动态库存在。

  • 2019-09-03 23:19:12

    ./configure 的配置和用法

    Linux环境下的软件安装,并不是一件容易的事情;如果通过源代码编译后在安装,当然事情就更为复杂一些;现在安装各种软件的教程都非常普遍;但万变不离其中,对基础知识的扎实掌握,安装各种软件的问题就迎刃而解了。Configure脚本配置工具就是基础之一,它是autoconf的工具的基本应用。

  • 2019-09-04 16:24:17

    Ubuntu apt-get更换为阿里源

    ​进入阿里巴巴开源镜像页面,找到ubuntu,点击后面的帮助,可以看到类似下面的介绍,加入就好。切记下面的第三步。

  • 2019-09-04 16:32:56

    Ubuntu tar 解压缩命令详解

    tar 解压缩命令详解,这五个是独立的命令,压缩解压都要用到其中一个,可以和别的命令连用但只能用其中一个。下面的参数是根据需要在压缩或解压档案时可选的。

  • 2019-09-04 16:50:35

    CMake入门笔记

    Make是一个跨平台的安装(编译)工具,可以用简单的语句来描述所有平台的安装(编译过程)。他能够输出各种各样的makefile或者project文件,能测试编译器所支持的C++特性,类似UNIX下的automake。只是 CMake 的组态档取名为 CMakeLists.txt。Cmake 并不直接建构出最终的软件,而是产生标准的建构档(如 Unix 的 Makefile 或 Windows Visual C++ 的 projects/workspaces),然后再依一般的建构方式使用。这使得熟悉某个集成开发环境(IDE)的开发者可以用标准的方式建构他的软件,这种可以使用各平台的原生建构系统的能力是 CMake 和 SCons 等其他类似系统的区别之处。