1. 前言
1.之前写了篇react-next.js服务端渲染
- 这次写个 vue端的
Nuxt.js
服务端如何发起请求- Nuxt.js
2. 使用内置的$axios模块
Nuxt.js
内置了$axios
模块,它是基于axios库的封装,可以在页面组件或插件中直接使用
- 代码
<template> <div> <!-- 页面内容 --> </div> </template> <script> export default { async asyncData({ $axios }) { const response = await $axios.get('https://api.example.com/data'); const data = response.data; return { data }; } }; </script>
1.
asyncData
方法在服务器端发起HTTP
请求,获取数据,并将数据
作为组件的属性返回
。
- 这样在页面组件中就可以使用data来展示数据了
3. 扩展
1.使用第三方库:除了内置的
$axios
模块,你还可以使用其他第三方库
,例如axios、isomorphic-fetch等。
- 使用这些
库
的方法
与普通的Vue应用中相同
。你可以在页面组件或插件中导入并使用这些库来发起请求。