vue实现流式请求ollama api进行ai聊天问答效果代码
代码语言:html
所属分类:其他
代码描述:vue实现流式请求ollama api进行ai聊天问答效果代码,自动将markdown换换成html,流式输出打字效果,可中断。
代码标签: vue 流式 请求 ollama api 进 行ai 聊天 问答
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Vue Chat with API</title>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/showdown.min.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/vue@2.6.1-dev.js"></script>
<style>
/* 样式可以根据你的需求进一步优化 */
#historylist {
min-height: 200px;
height: 400px;
background: white;
overflow-y: scroll;
border: 1px solid #ccc;
}
.mesay, .aisay {
padding: 10px;
margin: 10px;
border-radius: 5px;
}
.mesay {
background-color: aliceblue;
text-align: right;
}
.aisay {
background-color: #d0e7ff;
text-align: left;
}
#inputpannel{
display: flex;
}
#inputword {
flex-grow: 1;
margin-right: 10px;
padding: 10px;
border: 1px solid #ccc;
border-radius: 4px;
}
#inputword:focus {
resize: none;
border-color:#007bff;
}
#sendButton {
padding: 10px 20px;
b.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0