This a component provides easy use of tinymce for vue developers

You can see a demo and an example in this page: Demo & examples

$ npm install vue-tinymce-editor

import Vue from 'vue'
import tinymce from 'vue-tinymce-editor'
Vue.component('tinymce', tinymce)

You may use the component in your markup

<tinymce id="d1" v-model="data"></tinymce>

export default{
    data(){
        return {
            data : ''
        };
    }
}

If you wish to use tinymce in other languages, please follow these steps:

1. Download the language pack you wish to use from here.
2. Unpack the language file into your desired path, which is accessible from outside and there is a URL pointing to it.
3. Finally, set language_url in other_options to the URL pointing to the language file.

For example:

export default{
    data(){
        return {
            data : '',
            options: {
                language_url: 'http://example.com/js/langs/fa_IR.js' //This url points to location of persian language file.
            }
        };
    }
}

<tinymce id="d1" v-model="data" :other_options="options"></tinymce>

You can access the tinymce itself by setting a ref to this component:

<tinymce id="d1" v-model="data" ref="tm"></tinymce>

Then you can access the editor by calling:

this.$refs.tm.editor

If you like this project and it was useful for you don't let it die. Help me continue it. Thank you. or you can buy me a coffee