@yosgo/editor
v1.1.23
Published
The editor use React, Typescript, react-quill
Downloads
2
Keywords
Readme
YOSGO Editor
The editor use React, Typescript, react-quill
Feature
- Store and Generate with HTMLformat
- Insert image Url and upload image to imgur
- Embeded video with full width and 16:9 ratio
- Basic editor function
Get start
Install
styled-components is peerDependencies. If you don't install styled-components yarn add styled-components first.
yarn add @yosgo/editorEditor props
| props | required | type | description | | ------------- | -------- | ------------------------------- | ------------------------------------------------------------------------ | | value | yes | string | 編輯器中的內容，html 的字串內容 | | onChange | yes | function (html: string) => void | 當編輯器改變時取得 html 內容，並執行自訂函式 | | mode | no | string "normal", "simple" | 簡單模式僅支援粗體、文字超連結、圖片、影片。預設為正常模式 | | imgurClientId | no | string | 圖片上傳至指定 imgur application。無此屬性編輯器僅提供貼上圖片網址的功能 |
Viewer props
| props | required | type | description | | ----- | -------- | ------ | -------------------------------------------------------------------------- | | html | yes | string | 顯示 HTML 內容。透過 Viewer 元件，讓編輯情境與查看情境時的內容樣式保持一致 |
Example
Relative issue tracking
| Issue | 相關連結 | 狀態 | | ---------------------------------------------------------------------------- | ----------------------------------------------------------- | ---- | | react-quill build issue solve with "esModuleInterop": true | Link | 修正 | | react-quill build issue solve with "resolutions": {"@types/quill": "1.3.6" } | Link | 修正 | | extra lines | Link | 修正 | | BlockEmbed cause copy paste error | Link | 修正 |