logoAnt Design X

DesignDevelopmentComponentsPlayground
  • Ant Design X of React
  • Changelog
    v1.2.0
  • Basic Usage
    • Usage with create-react-app
    • Usage with Vite
    • Usage with Next.js
    • Usage with Umi
    • Usage with Rsbuild
  • Model Integration
    • OpenAI
      Updated
    • Qwen
      Updated
    • Others
  • Other
    • Contributing
    • dangerouslyApiKey Explanation
    • FAQ

Others

Resources

Ant Design
Ant Design Charts
Ant Design Pro
Pro Components
Ant Design Mobile
Ant Design Mini
Ant Design Web3
Ant Design Landing-Landing Templates
Scaffolds-Scaffold Market
Umi-React Application Framework
dumi-Component doc generator
qiankun-Micro-Frontends Framework
Ant Motion-Motion Solution
China Mirror 🇨🇳

Community

Awesome Ant Design
Medium
Twitter
yuque logoAnt Design in YuQue
Ant Design in Zhihu
Experience Cloud Blog
seeconf logoSEE Conf-Experience Tech Conference

Help

GitHub
Change Log
FAQ
Bug Report
Issues
Discussions
StackOverflow
SegmentFault

Ant XTech logoMore Products

yuque logoYuQue-Document Collaboration Platform
AntV logoAntV-Data Visualization
Egg logoEgg-Enterprise Node.js Framework
Kitchen logoKitchen-Sketch Toolkit
Galacean logoGalacean-Interactive Graphics Solution
xtech logoAnt Financial Experience Tech
Theme Editor
Made with ❤ by
Ant Group and Ant Design Community
loading

Currently, there is no standard protocol defining a "model interface specification," which can lead to compatibility issues between different protocols.

To address this, X provides tools to help developers resolve protocol compatibility issues.

Stream Parsing Tool

XStream parses ReadableStream data using the SSE protocol by default.

tsx
import { XStream } from '@ant-design/x';
async function request() {
const response =
await fetch();
// ...
// .....
for await (const chunk of XStream({
readableStream: response.body,
})) {
// Your protocol
console.log(chunk);
}
}

Request Tool

XRequest allows you to pass a custom fetch function for request customization.

tsx
import { XRequest } from '@ant-design/x';
const request = XRequest({
fetch: yourFetchFn,
});
request.create();