axios打通fastapi和vue,实现前后端分类项目开发

axios

axios是一个前后端交互的工具,负责在前端代码,调用后端接口,将后端的数据请求到本地以后进行解析,然后传递给前端进行处理。

比如,我们用fastapi写了一个接口,这个接口返回了一条信息:

bash 复制代码
{"message":"Hello World"}

我现在,想要把message的内容,在前端进行展示,这个时候就需要使用到axios了。

安装:

bash 复制代码
pnpm install axios

vue如何展示信息

html 复制代码
<script setup>
import { ref } from 'vue';


const message = ref("hello vue!")

</script>
<template>
  <div class="w-22rem h-22rem bg-blue-300">
    {{ message }}
  </div>
</template>
相关推荐
爱学习的狮王5 分钟前
ubuntu18.04安装nvm管理本机node和npm
前端·npm·node.js·nvm
东锋1.39 分钟前
使用 F12 查看 Network 及数据格式
前端
zhanggongzichu12 分钟前
npm常用命令
前端·npm·node.js
anyup_前端梦工厂19 分钟前
从浏览器层面看前端性能:了解 Chrome 组件、多进程与多线程
前端·chrome
chengpei14727 分钟前
chrome游览器JSON Formatter插件无效问题排查,FastJsonHttpMessageConverter导致Content-Type返回不正确
java·前端·chrome·spring boot·json
我命由我1234536 分钟前
NPM 与 Node.js 版本兼容问题:npm warn cli npm does not support Node.js
前端·javascript·前端框架·npm·node.js·html5·js
每一天,每一步1 小时前
react antd点击table单元格文字下载指定的excel路径
前端·react.js·excel
浪浪山小白兔1 小时前
HTML5 语义元素详解
前端·html·html5
小魔女千千鱼1 小时前
【真机调试】前端开发:移动端特殊手机型号有问题,如何在电脑上进行调试?
前端·智能手机·真机调试
16年上任的CTO1 小时前
一文大白话讲清楚webpack基本使用——11——chunkIds和runtimeChunk
前端·webpack·node.js·chunksid·runtimechunk