Vue3.0版本发送ajax请求

首先简单写一点json数据用来测试

{
    "name":"杨幂",
    "age":18,
    "gender":"女"

}

再来写Ajax接口用来在前台引入做铺垫

import {ref} from "vue"
//引入axios
import axios  from "axios";
//发送ajax请求
export default function(url:string){
    //加载状态
    const loading = ref(true)
    //加载请求信息
    const data = ref(null)
    //加载错误信息
    const errorMsg = ref("")
    //发送请求
    axios.get(url).then(response=>{
        loading.value=false
        data.value=response.data
    }).catch(error=>{
        loading.value=false
        errorMsg.value=error.message || "未知错误"
    })
    return{
        loading,
        data,
        errorMsg
    }
}

 以上 创建3个实例 分别是登录信息，请求信息，错误信心

登陆成功的话，登录信息-false，并且显示响应数据

 登陆失败的话，登录信息-false，并且显示错误信息。