エディターは Quill をベースとしたリッチテキストエディターコンポーネントです。
import { Editor } from 'primereact/editor';
エディターは内部で Quill エディターを使用しているため、依存関係としてインストールする必要があります。
npm install quill
エディターは、value および onTextChange プロパティを持つ制御されたコンポーネントとして使用されます。
<Editor value={text} onTextChange={(e) => setText(e.htmlValue)} style={{ height: '320px' }} />
readOnly が存在する場合、値は編集できません。
<Editor value="Always bet on Prime!" readOnly style={{ height: '320px' }} />
ツールバーは headerTemplate プロパティでカスタマイズされます。使用可能なコントロールについては、Quillドキュメントを参照してください。
<Editor value={text} onTextChange={(e) => setText(e.htmlValue)} headerTemplate={header} style={{ height: '320px' }} />
Quill は、アクセシビリティの観点から概してうまく機能します。ツールバーの要素はタブで移動でき、スクリーンリーダーに必要な ARIA ロール/属性を備えています。