跳到主要内容
版本:3.x

富文本编辑器

概述

富文本编辑器(RichEditor)允许你编辑预览 HTML 内容,以及上传图片。

use Filament\Forms\Components\RichEditor;

RichEditor::make('content')
Rich editor

自定义工具栏按钮

使用 toolbarButtons() 方法,你可以设置编辑器的工具栏按钮。此例中的选项为默认值。此外,'h1' 也可用:

use Filament\Forms\Components\RichEditor;

RichEditor::make('content')
->toolbarButtons([
'attachFiles',
'blockquote',
'bold',
'bulletList',
'codeBlock',
'h2',
'h3',
'italic',
'link',
'orderedList',
'redo',
'strike',
'underline',
'undo',
])

此外,你可以使用 disableToolbarButtons() 方法禁用指定按钮:

use Filament\Forms\Components\RichEditor;

RichEditor::make('content')
->disableToolbarButtons([
'blockquote',
'strike',
])

要禁用所有工具栏按钮,请将 toolbarButtons([]) 设置为空数组或者使用 disableAllToolbarButtons()

上传图片到编辑器

使用配置方法你可以自定义图片上传方式:

use Filament\Forms\Components\RichEditor;

RichEditor::make('content')
->fileAttachmentsDisk('s3')
->fileAttachmentsDirectory('attachments')
->fileAttachmentsVisibility('private')