14、$axios异步加载数据asyncData

安装@nuxtjs/axios

https://axios.nuxtjs.org/setup

bash 复制代码
npm install @nuxtjs/axios

nuxt.config.js

javascript 复制代码
export default {
  modules: ['@nuxtjs/axios']
}

mock数据

https://mock.mengxuegu.com/

没有账号直接输入账号、密码登录会自动创建,没有修改密码的入口需要保存好账号密码。

使用

https://axios.nuxtjs.org/usage

asyncData

javascript 复制代码
async asyncData({ $axios }) {
  const ip = await $axios.$get('http://icanhazip.com')
  return { ip }
}

methods/created/mounted/etc

javascript 复制代码
methods: {
  async fetchSomething() {
    const ip = await this.$axios.$get('http://icanhazip.com')
    this.ip = ip
  }
}
相关推荐
2026几秒前
11. vite打包优化
前端·javascript·vite
拾光拾趣录5 分钟前
组件封装的⼀些基本准则
前端·前端工程化
CAD老兵6 分钟前
TypeScript 中如何转换两个具有相同值的枚举类型?
前端
1024小神10 分钟前
Cocos游戏开发中,检测两个物体碰撞,并实现物理反弹逻辑
前端·javascript
拾光拾趣录11 分钟前
Vue Router 执行顺序
前端·vue.js·vue-router
前端权12 分钟前
Vue3 多行文本溢出隐藏与展开收起功能实现总结
前端·vue.js
用户38022585982413 分钟前
vue3源码解析:调度器
前端·vue.js
一一一87123 分钟前
javaScript数据存储, 对象和原型与原型链
javascript
Dolphin_海豚35 分钟前
electron windows 无边框窗口最大化时的隐藏边框问题
前端·electron·api
梦想CAD控件38 分钟前
WEB CAD与Mapbox结合实现在线地图和CAD编辑(CGCS2000)
前端·javascript·vue.js