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

Come CKEditor TinyMCE Quill ProseMirror, non esiste una documentazione ufficiale in lingua cinese. Questo avrà un grande impatto sulla tua produttività (stasera, il lavoro straordinario)

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

Tempo e frequenza di pubblicazione di 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 è stato rilasciato dalla versione V5 con maggiori aggiornamenti tecnici.

#1. Upgrade a capacità L1

L'API document.execCommand è stata abbandonata, utilizzando slate.jsopen in new window (ma non dipendente da React) come kernel e aggiornata a funzionalità 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 ha una documentazione dettagliata in cinese, così come un ambiente di comunicazione cinese. Open in New Window è un programmazione.

# Feedback e comunicazione tempestivi

Puoi anche inviare un problema su GitHub, e il team riceverà un feedback tempestivo o accetta.

# 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.
Continueremo a supportare altri framework e potremmo anche inviare un problema.

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à.