logo
GitHub

组件

JuiceEditor 组件是 JuiceEditor 的核心组件,用于在页面中嵌入编辑器。以下是所有可用的组件:

TaskList 组件

TaskList 组件用于在页面中显示一个任务列表。

TaskList组件

Toc 组件

Toc 组件用于在页面中显示一个目录。

Banner 组件用于在页面中显示一个横幅,通常用于展示重要信息。

Banner组件

这里可以看到例子:https://www.kuaiyizhi.cn/ideas/F9134AAC-64CE-407F-88C7-602AF21756B3

Blockquote 组件

BlockQuote 组件用于在页面中显示一个引用块,通常用于引用他人的话。

BlockQuote组件

这里可以看到例子:https://www.kuaiyizhi.cn/ideas/3F8954F2-153A-499A-A516-5EFD9A74F12A

BulletList 组件

BulletList 组件用于在页面中显示一个无序列表。

BulletList组件

这里可以看到例子:https://www.kuaiyizhi.cn/ideas/F9134AAC-64CE-407F-88C7-602AF21756B3

Code 组件

基于 Monaco Editor 实现,支持语法高亮、代码提示等。

Heading 组件

Heading 组件用于在页面中显示一个标题,通常用于展示重要信息。

Heading组件

这里可以看到例子:https://www.kuaiyizhi.cn/ideas/3D37B214-9946-41F3-87F7-DC4736D026A3

Image 组件

Image 组件用于在页面中显示一张图片。

Image组件

这里可以看到例子:https://www.kuaiyizhi.cn/ideas/32C93F12-DD0C-487C-83FC-967CD07CBE2A

绘图

Draw a Picture

经过额外的配置,可以实现在页面中绘图的功能。

安装扩展包

npm i @coffic/juice-editor-draw

复制静态文件

cp -r node_modules/@coffic/juice-editor-draw/dist ./public/draw

配置

你需要告诉 JuiceEditor 如何访问刚刚复制的静态文件。

editor.setDrawLink('http://localhost:8080/draw/index.html?');

Keyboard 组件

Keyboard 组件用于在页面中显示一个键盘。

Keyboard组件

Link 组件用于在页面中显示一个链接。

Link组件

这里可以看到例子:https://www.kuaiyizhi.cn/ideas/F9134AAC-64CE-407F-88C7-602AF21756B3

Paragraph 组件

Paragraph 组件用于在页面中显示一段文字。

Paragraph组件

这里可以看到例子:https://www.kuaiyizhi.cn/ideas/F9134AAC-64CE-407F-88C7-602AF21756B3

Table 组件

表格组件用于在页面上以表格形式显示数据。

表格组件

您可以在这里查看示例:https://www.kuaiyizhi.cn/ideas/32C93F12-DD0C-487C-83FC-967CD07CBE2A