search

imzbf / md-editor-v3

Markdown editor for vue3, developed in jsx and typescript, dark theme、beautify content by prettier、render articles directly、paste or clip the picture and upload it...
https://imzbf.github.io/md-editor-v3
MIT License
1.69k stars 162 forks source link

如何添加一个自定义插件，可否提供思路？ #458

Closed itshizhan closed 9 months ago

itshizhan commented 9 months ago

Describe the issue

想给编辑器添加一个点击显示隐藏功内容的功能，如下图： Dingtalk_20240221093127

默认显示英文，当点击“查看中文翻译” 的按钮时，显示中文翻译： Dingtalk_20240221093138

看到，官方文档里面有自定义工具栏的功能，但是和这个好像不太一样。 我想到的是，如果可以自定义一个工具栏，插入一个类似语雀编辑器折叠块的组件, 折叠块可以输入标题即“查看中文翻译”，也可以输入内容。 111_20240221093917

默认只显示标题，点击显示内容？ 但是这个自定义的组件怎么和编辑器整合呢？ 或者实现类似功能，可否提供一个思路？

非常感谢

Procedure version

v20.11.0

Reproduction link

No response

imzbf commented 9 months ago

这个编辑器是使用markdown-it做内容编译的，首先建议你去找找markdonw-it-xxx名的扩展是否有你想要的。链接：https://www.npmjs.org/browse/keyword/markdown-it-plugin

如果没有，了解下markdown-it的扩展的开发方式，这个和内置的代码块切换很类似