aichat-math-viewer

React 组件，用于渲染带有数学公式的 Markdown 内容。

安装

npm install aichat-math-viewer
# 或
yarn add aichat-math-viewer

使用方法

首先需要在您的项目中导入 KaTeX 样式：

import 'katex/dist/katex.min.css';

使用组件：

import React from 'react';
import { MathViewer } from 'aichat-math-viewer';

function App() {
  const markdownWithMath = `
# 数学公式示例

行内公式: $E=mc^2$

块级公式:

$$
\\frac{d}{dx}\\left( \\int_{a}^{x} f(u)\\,du\\right)=f(x)
$$
  `;

  return (
    <div className="App">
      <MathViewer content={markdownWithMath} />
    </div>
  );
}

export default App;

特性

• 支持渲染 Markdown 内容
• 支持 LaTeX 数学公式
• 支持 KaTeX 扩展 (mhchem)
• 轻量级设计

API

MathViewer

主要组件，用于渲染 Markdown 和数学公式。

Props

| 属性 | 类型 | 必需 | 描述 | |------|------|------|------| | content | string | 是 | 包含 Markdown 和数学公式的内容 | | ...rest | HTMLDivElement 属性 | 否 | 传递给容器 div 的其他 HTML 属性 |

MarkdownContent

内部组件，也可单独使用。

Props

| 属性 | 类型 | 必需 | 描述 | |------|------|------|------| | content | string | 是 | 包含 Markdown 和数学公式的内容 |

许可证

MIT