vue tinymce

Vue-Tinymce

Tinymce -Komponenten, die VUE -Entwicklern zur Verfügung gestellt werden

Zweck

Einfache Verwendung der VUE -Komponenten von Tinymce für Entwickler. Geben Sie den Entwicklern einen sehr einfachen und leicht verständlichen Quellcode als Referenz an und können Sie diese Komponente natürlich auch direkt in Ihrem Projekt verwenden. Wenn Sie ein Problem finden, können Sie das Problem erwähnen und Ihr Feedback erwarten?

Wie man benutzt

Komponenten installieren

yarn add @packy-tang/vue-tinymce
# or
npm install @packy-tang/vue-tinymce

Eingeführt

 < template >
    <!-- 全局引入TinyMCE -->
    < script src =" //unpkg.com/[email protected]/tinymce.min.js " > </ script >
    <!-- App -->
    < div id =" app " >
        < vue-tinymce
            v-model =" content "
            :setup =" setup "
            :setting =" setting " />
    </ div >
</ template >
< script >
    import Vue from "vue"
    import VueTinymce from "@packy-tang/vue-tinymce"

    //安装组件
    Vue . use ( VueTinymce )

    new Vue ( {
        el : "#app" ,
        data : function ( ) {
            return {
                content : "<p>html content</p>" ,
                setting : {
                    height : 500
                }
            }
        } ,
        methods : {
            setup ( editor ) {
                console . log ( editor )
            }
        }
    } )
</ script >

Andere Verwendungsbeispiele

• VUE-CLI-Nutzungsbeispiel: Portal
• Beispiel für Webpack -Nutzung: Portal (zugefüllt werden)

Eigentum

Name	beschreiben
:content	Geben Sie die String v-model , da der Textinhalt in den Editor übergeben wird
@change	KeyUp ExecCommand Function ein NodeChange Input Undo Redo Change
:setting	Geben Sie Object , Editoreinstellungen und setup ein, die hier nicht empfohlen wird
:setup	Function , häufig verwendete und benutzerdefinierte Editor -Verarbeitung. In der Komponente wurde eine gewisse Verarbeitung durchgeführt. Es wird empfohlen, hier benutzerdefinierten Code hinzuzufügen

Weitere Nutzungsdetails

Wenn Sie mehr wissen möchten, wechseln Sie bitte zu den Verwendungsdetails

Lokales Debuggen

 # 运行本地例子
$ npm run serve 
# 构建
$ npm run build
# 发布版本
$ npm run release

Unterstützung aufbauen

Dieses Repository wird mit SAO-ESM als Vorlage erstellt.

Lizenz

Copyright (c) packy-tang [email protected]

Open Source -Software nach dem MIT -Protokoll.