Effect: /** * File path:/src/tinymce/plugins/images/index.js */ import request from “@/utils/request”; tinymce.PluginManager.add(‘images’, function (editor) {<!– –> let pluginName = ‘Multiple image upload’ let bodyId = editor.getParam(‘body_id’, ”, ‘hash’) var imgList = [] //Configure popup layer let openDialog = function () {<!– –> return editor.windowManager.open({<!– –> title: pluginName, size: ‘medium’, body: {<!– –> type: ‘panel’, items: [ […]
Tag: tinymce
vue2 uses tinymce rich text editor-image upload, paste image upload to the server
1. Install the tinymce rich text editor plug-in npm i tinymce npm i @tinymce/tinymce-vue 2. Create the Editor.js file to encapsulate the component for use <template> <div class=”tinymce-editor”> <editor v-model=”myValue” :init=”init” :disabled=”disabled” @onClick=”onClick”> </editor> </div> </template> <script> import tinymce from ‘tinymce/tinymce’ import Editor from ‘@tinymce/tinymce-vue’ import Api from “@/api/typical/typical”; //Introduce the interface import Vue from […]
Use Tinymce in Vue project to solve image upload/paste
Preface Recently, because the backend management side of the company’s project needs to implement an editor function, on the one hand, it can meet the needs of editing various article content, and on the other hand, it needs to edit some course-related introductions by itself, so I spent some time comparing and experiencing some existing […]
The vue rich text editor TinyMCE sets some tags in the content to be non-editable
Scenario: When using the rich text editor TinyMCE to set up a message template, you need to embed some fixed tags. The fixed tags are used to dynamically assemble data when parsing the template in the background. The embedded tags are in text format and are easily modified by mistake, resulting in the inability to […]
The most powerful tinymce rich text editor integrated in the Vue3 project
Foreword tinymce is currently recognized as the best rich text editor. This article will explain in detail how to integrate tinymce in the vue3 project and encapsulate tinymce into a component. final effect Text 1. Install dependencies, Here we use tinymce5, and the latest version is tinymce6. There will be differences in plug-ins between different […]
tinymce editor imports the full version of docx and doc format Word documents
Something to note before reading this article On the front end, I import a Word document and automatically parse it into HTML and then insert it into the tinymce editor. Here I use mammoth.js to identify the Word content and set it into the editor. Mammoth can only parse Word in .docx format. The current […]
The whole process of using the rich text editor tinyMCE in vue2
Step 1: Install TinyMCE $npm install [email protected] -S $npm install @tinymce/[email protected] -S Step 2: Find the tinymce folder in node_modules, move the internal files into the pubilc/tinymce folder, and introduce tinymce.min.js into the index.html file Note: If you do not put the js file locally, the registration key prompt will be displayed when the rich […]
Using tinymce rich text editor in vue3 project
Introduction Recently, I used a very practical and full-featured rich text editor in my project—-Tinymce Editor First contribute the document – English document Chinese document The editor effect is as shown in the figure Installation Install first npm install tinymce -S Secondly, select the tinymce-vue version according to the vue version of the project. If […]
Under the window system, the placeholder of the tinymce rich text editor does not disappear under the Sogou input method
Editor placeholder and content overlap problem under window Sogou input method In this case, there are some compatibility bugs in the tinymce plug-in library. We need to replace the placeholder with our own handwritten style or js. The code is as follows: // Get the content of the rich text box const handleChange = (editorContent) […]
How does the tinymce editor customize the plugin (vue)
tinymce editor custom function plugin Including how to add icons to the toolbar of the tinymce editor and implement custom functions, (PS: The editor I use is version 5.x, and the plug-in file for version 6.x may be plugin.min.js, but the principle is the same ) Custom plugin process Write plugin file plugin First of […]