二、Vue3网络[axios]

一、基础使用

配置:

import {
    
     createApp } from 'vue'
import axios from 'axios'
import App from './App.vue'
import store from './store.js'
const app = createApp(App)

app.config.globalProperties.$http = axios
app.mount('#app')

使用:this.$http({})
写法一:

        axios({
    
    
            method: 'get',
            url: 'http://127.0.0.1:8000/api/db/getName/GtTJUiS05A1',
			headers: {
    
    'X-Custom-Header': 'foobar'},
			params: {
    
    
		    	ID: 12345
		  	},// 这个是get数据
		  	data:{
    
    
			},// 这个是json数据
		    // `responseType` 表示服务器响应的数据类型,可以是 "arraybuffer", "blob", "document", "json", "text", "stream"
		  	responseType: "json", // 默认的
        }).then((result) => {
    
    
            console.log(result.data.username)
        })

写法二:

                 axios.get('/user', {
    
    
                        params: {
    
    
                            ID: 12345
                        }
                    }).then(function (response{
    
    
                        console.log(response);
	                }).catch(function (error) {
    
    
	                    console.log(error)
	                })

二、流式打印输出

解释:主要用到onDownloadProgress方法接收后端传来的流式输出

                    this.$http({
    
    
                        method: 'post',
                        data: data,
                        url: url,
                        onDownloadProgress: function (progressEvent) {
    
    
                            let content = progressEvent.event.currentTarget.response
                            if (progressEvent.event.currentTarget.status == 200) {
    
    
                                thisNew.$store.state.chat[thisNew.id].answer = content
                                thisNew.answer = content
                            } 
                        }
                    },).then(function () {
    
    

                        }
                    }).finally(function () {
    
    
 
                    })

猜你喜欢

转载自blog.csdn.net/weixin_46765649/article/details/131048552