WangEditor5 Editor (versione ZBLOG)

wangEditor5 Editor, libero e open source (basato sul protocollo open source MIT), autore originale Shuang Yue, sito ufficiale dell 'autore:https: //www.wangeditor.com/, supporta lo sviluppo secondario, tutti possono essere sicuri di utilizzare!

Inoltre, l'autore originale sta aggiornando l'editor wangEditor5, quindi possiamo anche aggiornare il nostro plugin con l'aggiornamento dell 'autore originale.

Grazie alla documentazione di sviluppo completa di wangEditor5, siamo stati in grado di realizzarlo come plugin per Z-blog PHP.

C'è stato un tempo in cui abbiamo cercato qualcosa di simile.Il numero di microprocessori pubblicoCosì facile da usare il moderno editor di testo ricco, ora è qui!

Nota: non può essere utilizzato con altri plugin di editor, chiudiamo in anticipo altri plugin di editor (ad esempio, l'editor UEditor di Z-blog PHP)!

WangEditor5 Editor per impostazione predefinita non supporta l'uso sul telefono cellulare, in realtà indipendentemente da qualsiasi plugin editor, l'esperienza utente sul telefono cellulare è molto scarsa, quindi WangEditor5 Editor ufficiale semplicemente tagliato questa funzione.

Naturalmente, questa funzione può anche essere sbloccata, è solo necessario personalizzare la barra degli strumenti visualizzata sul telefono cellulare, per migliorare l'esperienza utente No, gli utenti che hanno bisogno possono trovarci personalizzabile!

Ecco la presentazione dell 'editor sul sito ufficiale di WangEditor

# Vantaggi

# problemi con altri editor di testo ricco

Ricerca su Internet "Web rich text editor" troverete molti risultati, come UEditor kindEditor in patria, CKEditor TinyMCE Quill ProseMirror Draft Slate all 'estero e così via. Ci sono anche molte persone che utilizzano questi editor, o per fare sviluppo secondario.

Tuttavia, tutti hanno alcuni problemi di seguito (colpire la lavagna ~), che possono influenzare notevolmente l'efficienza di sviluppo, i costi di sviluppo e la stabilità del prodotto.

# Tecnologia vecchia

Come UEditor KindEditor, utilizza ancora l'API document.execCommand. Ciò influenzerà notevolmente la stabilità e la scalabilità del prodotto.

Non ci sono problemi ovunque, sarà disprezzato dal PM: "Come può fare l'altro xxx?"

Il cinese non è amichevole

如 CKEditor TinyMCE Quill ProseMirror 等，没有官方的中文文档。这将大大影响你的开发效率（今晚加班～）

P.S.: In inglese, per favore, non lo fai.

Richiede un sacco di sviluppo secondario

Come ProseMirror Draft Slate, sono anche editor di testo ricco, ma sono solo un core o un controller, non una funzionalità completa.

Un gran numero di sviluppo secondario, non solo porterà a un aumento significativo dei costi di ricerca e sviluppo (chiuso questo mese ~), ma può anche apparire bug infiniti a causa di test imperfetti, cadere nel fango.

PS: A meno che non abbiate un forte bisogno di sviluppo personalizzato.

# vincolazione del quadro

Slate e Draft si basano sul framework React. Se vuoi utilizzare Vue, il carico di lavoro e la difficoltà sono molto grandi.

# Nessun componente ufficiale come React Vue

Alcuni framework-free, come ProseMirror, richiedono di incapsulare i componenti se si utilizza Vue React.

Il nuovo prodotto non è ancora stabile

Gli editor elencati sopra sono prodotti più maturi e il numero di utenti è maggiore. Potresti anche trovare altri prodotti, come quelli di recente sviluppo, che non hanno molti utenti.
In ogni caso, si prega di scegliere con cautela, perché l'editor di testo ricco ha davvero troppi pozzi e richiede un sacco di test e utilizzo per lentamente stabilizzare.

Scegliere prodotti stabili, può essere riferito

github stars

Download di npm

npm 发布时间和频率

Numero di risultati relativi ai motori di ricerca

C'è una grande fabbrica approvata?

Esistono test unitari / test e2e

I vantaggi di # wangEditor

Il valore di un prodotto è quello di risolvere i problemi degli utenti, aumentare l'efficienza, ridurre i costi, aumentare la stabilità e la scalabilità.

WangEditor non è per fare, né semplicemente imitare chi, ma dopo l'analisi del problema sopra, dare una soluzione sistematica. Lo scopo è quello di risolvere veramente i problemi degli utenti e di produrre il proprio valore.

# Utilizzo di tecnologie mainstream

wangEditor 从 V5 版本开始，有较大的技术更新。

#1. Upgrade a capacità L1

弃用了 document.execCommand API ，使用 slate.jsopen in new window（但不依赖 React）为内核，升级为 L1 能力。

Questa è anche la soluzione tecnologica attualmente utilizzata dai principali editor di testo ricco, come il famoso Quill ProseMirror Draft.

#2. Utilizzo di VDOM

Utilizzare la tecnologia vdom (basata sudom.jsopen in new window) per aggiornare la vista, separare il modello e la vista per aumentare la stabilità.

#3. estensione

Utilizzare il meccanismo di estensione di plug-in e moduli per garantire la scalabilità. In futuro saranno ampliate altre funzioni.

In realtà, ora le varie funzioni di wangEditor sono costruite tramite estensioni di plug-in e moduli.

# Documenti cinesi

wangEditor 有详细的中文文档，以及中文交流环境。因为作者open in new window就是国内程序员。

# Feedback e comunicazione tempestivi

也可以去 github 提交 issue ，团队都会及时反馈或受理。

# Integra tutte le funzionalità, senza necessità di sviluppo secondario

wangEditor ha tutte le funzioni comuni di gestione del testo ricco e può soddisfare la maggior parte delle esigenze di utilizzo. Può essere utilizzato direttamente, senza bisogno di un ulteriore sviluppo.

/ / wangEditor ha 50 + menu editor.getAllMenuKeys () [
  "bold","underline","italic","through","code","clearStyle","headerSelect","header1","header2","header3",
  "color","bgColor","insertLink","editLink","unLink","viewLink","insertImage","deleteImage","editImage",
  "viewImageLink","imageWidth30","imageWidth50","imageWidth100","blockquote","emotion","fontSize","fontFamily",
  "indent","delIndent","justifyLeft","justifyRight","justifyCenter","lineHeight","redo","undo","divider","codeBlock",
  "bulletedList","numberedList","insertTable","deleteTable","insertTableRow","deleteTableRow","insertTableCol",
  "deleteTableCol","tableHeader","tableFullWidth","insertVideo","deleteVideo","uploadImage","codeSelectLang"]

PS: Allo stesso tempo, wangEditor ha una ricca API e sufficiente estensibilità per consentire di personalizzare menu di sviluppo, moduli, plug-in e altro ancora.

È molto facile usare Vue React

wangEditor è basato sul kernel slate, ma non dipende da React, quindi non dipende da framework.

Inoltre, abbiamo ufficialmente incapsulato i componenti di Vue React, che possono essere facilmente utilizzati con framework come Vue React.
其他框架，我们会继续支持，大家也可以提交 issue 。

Cammina 5000 buchi

wangEditor open source per molti anni, un gran numero di utenti utilizzati e feedback, ha risolto molti problemiopen in nuova finestra. Durante il test della versione V5, anche questi problemi sono stati testati ripetutamente per garantire la massima stabilità.

# lavoro di squadra, continua iterazione di upgrade

WangEditor non è più un autore da solo, abbiamo un team di più persone, insieme per risolvere i bug, aggiornare le funzionalità, monitorare i problemi, rispondere alle domande della comunità.