vue3 大模型流式输出

1.引入安装包

npm i md-editor-v3
npm i @microsoft/fetch-event-source

项目中引用

<template>
   <MdPreview :modelValue="state.content" />
</template>
<script setup>
import { ref, reactive, computed, onMounted, watch } from "vue";
import { fetchEventSource } from "@microsoft/fetch-event-source";
import { MdPreview, MdCatalog } from "md-editor-v3";
let state = reactive({
  content:''
})

const getMsg = ()=>{
let url = '请求url地址'
let dataInfo = {} //请求入参
fetchEventSource(url, {
    signal,
    method: "POST",
    headers: {
      "Content-Type": "application/json",
      "X-Access-Token":'',//你的=token
    },
    body: JSON.stringify(dataInfo),//请求入参
    openWhenHidden: true,
    onmessage(event) {
        //根据返回值进行内容拼接
        state.content = `${state.content}${event.content}`
    },
    onclose() {
      //请求完成自动关闭
    },
    onerror(err) {
       //请求异常
    },
  });
}
</script>