draft-js-toolbar-link-plugin 是一个基于 Draft.js 编辑器的插件，可以为编辑器添加链接插入功能，方便用户快速插入链接。
安装
可以通过 npm 来安装 draft-js-toolbar-link-plugin:
$ npm install draft-js-toolbar-link-plugin --save
引入
在项目中使用之前，需要先引入插件：
import createToolbarPlugin from 'draft-js-toolbar-link-plugin'; const toolbarPlugin = createToolbarPlugin();
然后将插件加入到 Draft.js 编辑器中：
-- -------------------- ---- -------
----- - ------- - - --------------
----- ------- - ----------------
----- ------ - -------------------------------------------------- -----------
----- ---------- - -- -------- -- -- -
-------
--------------------
-------------------
-----------------
--------------------
--
--使用
使用非常简单！只需要在你的工具栏中添加一个链接按钮：
<Toolbar>
{// 其他按钮}
<LinkButton />
</Toolbar>然后实现 LinkButton 组件：
-- -------------------- ---- -------
------ ------ - --------- - ---- --------
------ - ------------ --------- - ---- -----------
------ - ---------- - ---- -------------------------------
----- ---------------- ------- --------- -
----------- - -- -- -
----- - ------------ -------- - - -----------
-- ------------------
----- --- - -------------------- --- ------
----- ---- - -------------------- --- -------
----- ------------ - --------------------------------
----- ---------------------- - --------------------------
-------
----------
-
----
------- ---------
-
--
----- --------- - -------------------------------------------------
----- -------------- - ---------------------------- -
--------------- ---------------------
--------------------------------
---------------------------
---------
--
---
-------------------------
--
-------- -
------ -
----------- --------------------------------------------
--
-
-现在，你的工具栏上就有了一个链接按钮，用户可以点击这个按钮，弹出输入框，输入链接和文本，即可插入一个链接。
总结
draft-js-toolbar-link-plugin 可以为 Draft.js 编辑器添加链接插入功能，使用非常简单，只需要在工具栏中添加一个链接按钮，然后弹出输入框，输入链接和文本即可插入链接。这对前端开发人员来说非常有用，特别是在需要快速生成链接的情况下。
示例代码见：https://github.com/draft-js-plugins/draft-js-plugins/tree/master/packages/toolbar-link
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600562dc81e8991b448e04b1