Ant Design X 和 Element-Plus-X

Ant Design X 是 Ant Design 的全新 AGI 组件库,旨在帮助开发者更轻松地研发 AI 产品用户界面。提供AI交互所需的Attachments、Sender、ThoughtChain等组件,以及useXAgent、XStream等hooks。

具备支持Vue和React两个版本

React: github.com/ant-design/...

Vue: github.com/wzc520pyfm/...

重点介绍一下相关实用的hooks:

  • XStream
    • 使用场景:将 SSE 协议的 <font style="color:rgba(0, 0, 0, 0.88);">ReadableStream</font> 转换为 <font style="color:rgba(0, 0, 0, 0.88);">Record</font>;将任何协议的 <font style="color:rgba(0, 0, 0, 0.88);">ReadableStream</font> 解码并读取。
    • 补充:<font style="color:rgba(0, 0, 0, 0.88);">Server-Sent Events</font>(简称 SSE )是一种服务器 **主动****向浏览器发送实时更新数据的通信方式,属于 HTML5 标准的一部分。SSE 是浏览器内置支持的、 单向的**、轻量级的实时通信机制 ------ 服务器可以持续地将数据推送给前端,而无需前端不断轮询。
  • XRequest
    • 封装请求格式,可以符合OpenAI标准的LLM请求格式
    • 单次请求,不管理上下文
  • useXAgent
    • 与后端模型进行交互,提供抽象数据流
  • useXChat
    • useXAgent 的基础上做了进一步的封装,提供了更完整、更强大的对话管理能力 ,适合需要多轮对话、上下文控制、模型切换、流式响应的复杂场景

Element-Plus-X开箱即用的AI交互组件库,对标Ant Design X,专为Vue框架使用。

在Ant Design X的对标下,进行了重构,例如将 ant-design-xXRequest 进行了重构,将其拆分成 **前端终止场景****请求终止场景** 两种场景 分别对应hooks useSend(前端终止场景)和工具类 XRequest(请求终止场景)。

目前正在开发测试中......

github.com/HeJiaYue520...

相关推荐
JarvanMo1 分钟前
Flutter Web vs Mobile:主要区别以及如何调整你的UI
前端
IT_陈寒21 分钟前
Java性能优化:从这8个关键指标开始,让你的应用提速50%
前端·人工智能·后端
天生我材必有用_吴用23 分钟前
Vue3+Node.js 实现大文件上传:断点续传、秒传、分片上传完整教程(含源码)
前端
摸鱼的春哥38 分钟前
前端程序员最讨厌的10件事
前端·javascript·后端
牧羊狼的狼5 小时前
React 中的 HOC 和 Hooks
前端·javascript·react.js·hooks·高阶组件·hoc
知识分享小能手6 小时前
React学习教程,从入门到精通, React 属性(Props)语法知识点与案例详解(14)
前端·javascript·vue.js·学习·react.js·vue·react
魔云连洲6 小时前
深入解析:Vue与React的异步批处理更新机制
前端·vue.js·react.js
mCell7 小时前
JavaScript 的多线程能力:Worker
前端·javascript·浏览器
超级无敌攻城狮8 小时前
3 分钟学会!波浪文字动画超详细教程,从 0 到 1 实现「思考中 / 加载中」高级效果
前端
excel9 小时前
用 TensorFlow.js Node 实现猫图像识别(教学版逐步分解)
前端