ckeditor - CKEditor 5 链接：设置链接的默认目标或编辑目标

Question

在 CKEditor 5 中，我在链接对话框中看不到目标属性的字段。

如何添加这样的字段？或者将 target=_blank 设置为默认值。谢谢

Answer 1

自Link Plugin11.1.0版本以来，添加了链接装饰器功能。此功能提供了一种简单的方法来定义规则，何时以及如何向链接添加一些额外的属性。

可能有手动或自动装饰器。

首先提供了一个 UI 开关，用户可以切换它。当用户编辑链接并切换它时，预配置的属性将被添加到链接中，例如target="_blank".

第二个，在从编辑器获取内容时自动应用。在这里，您需要提供一个回调函数，该函数基于链接的 URL 决定是否应应用给定的一组属性。

还有一个预配置的装饰器，可以使用 simple config.link.addTargetToExternalLinks=true. 它将添加target="blank"和到以:或.rel="noopener noreferrer"开头的所有链接。http://https:////

Answer 2

您可以通过在 CKEditor 初始化脚本中添加此代码来实现它：

ClassicEditor
    .create( document.querySelector( '#editor' ), {
        // ...
        link: {
            decorators: {
                openInNewTab: {
                    mode: 'manual',
                    label: 'Open in a new tab',
                    defaultValue: true,         // This option will be selected by default.
                    attributes: {
                        target: '_blank',
                        rel: 'noopener noreferrer'
                    }
                }
            }
        }
    } )
    .then( ... )
    .catch( ... );

这是文档链接。它会正常工作。