vue集成ckeditor富文本框,怎么获取CKEditor实例?
CKEDITOR 版本5 ,vue集成形式
vue集成ckeditor富文本框,由于不是通过js创建的富文本对象,所以,无法取得实例对象,官方说明

官方在builds--》Getting and saving data 栏中有进行说明,
既然我们使用了vue,那就只能通过CKEditor的ready事件来获取 实例对象 了。
官方使用的例子,去这里看index.html文件即可:https://github.com/ckeditor/ckeditor5-vue/tree/master/sample
这是关于ready事件的说明,网址:https://ckeditor.com/docs/ckeditor5/latest/api/module_editor-balloon_ballooneditor-BalloonEditor.html#static-function-create

翻译的,看个大概就行 /(ㄒoㄒ)/~~
它的参数就是 实例的CKEditor富文本框的对象 ,当然,这个对象你可以自己保存起来为js代码使用;;;这个 ckeditor 自定义标签,是 ckeditor5-vue 插件声明的。不过你需要照这个文档熟悉完后就明白了:https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/frameworks/vuejs.html
<ckeditor :editor="editor" v-model="editorData" :config="editorConfig" @ready="onEditorReady"></ckeditor>
这里说明一下,我们使用的vue数据对象中的 editor属性 并不是这个ckeditor的实例对象,
通过 @ready 的事件方法的形参就是CKEDITOR的实例对象,自己进行保存起来就行了(@(缩写形式)===(等同于) v-on);如果是个别方法使用需要这个富文本框实例的话,则参考 Function.bind 使用的方法就行,直接绑定当前上下文对象
vue集成ckeditor富文本框,怎么获取CKEditor实例?的更多相关文章
- vue集成百度富文本编辑器
1.前期工作,访问百度富文本官网下载相应的百度富文本文件,根据后端用的技术下载相应的版本,建议下载最新版UTF-8版 (有图有真相,看图) https://ueditor.baidu.com/webs ...
- Vue集成tinymce富文本编辑器并实现本地化指南(2019.11.21最新)
tinymce是一款综合口碑特别好.功能异常强大的富文本编辑器,在某些网站,甚至享有"宇宙最强富文本编辑器"的称号.那么,在Vue项目中如何集成呢?这并不困难,只需要参照官方教程 ...
- vue 集成百度富文本编辑器
<template> <div> <textarea style="display:none" id="editor_content&quo ...
- vue 集成 NEditor 富文本
下载NEditor 放在 vue 项目下面 public 文件中. 安装 vue-neditor-wrap 执行命令 npm install vue-neditor-wrap 代码使用 ...
- vue集成CKEditor构建框架的使用,遇到富文本框不出现工具栏等操作
官方关于Vue集成CKEditor富文本框的文档:https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/framew ...
- 项目页面集成ckeditor富文本编辑器
步骤一.引入ckeditor.js (注:本实例以ThinkPHP3.2框架为载体,不熟悉ThinkPHP的朋友请自行补习,ckeditor文件代码内容也请去ckeditor官网自行下载) 作为程序员 ...
- 常用的富文本框插件FreeTextBox、CuteEditor、CKEditor、FCKEditor、TinyMCE、KindEditor ;和CKEditor实例
http://www.cnblogs.com/cxd4321/archive/2013/01/30/2883078.html 目前市面上用的比较多的富文本编辑器有: FreeTextBox 一个有很多 ...
- 第三百九十五节,Django+Xadmin打造上线标准的在线教育平台—Xadmin集成富文本框
第三百九十五节,Django+Xadmin打造上线标准的在线教育平台—Xadmin集成富文本框 首先安装DjangoUeditor3模块 Ueditor HTML编辑器是百度开源的HTML编辑器 下载 ...
- 使用kindeditor获取不到富文本框中的值
获取不到富文本框中的值,网上一搜一堆,但最终没有几个能解决问题的,折腾一番最终解决.注意就是红色代码,加上之后就可以解决问题了. KindEditor.ready(function (K) { var ...
随机推荐
- 轩辕展览-为什么要做VR虚拟展厅设计?
沉浸感,有趣和互动体验VR虚拟展厅设计给客户带来高度的沉浸感和互动体验,给客户一种真实的感觉,让客户更愿意参与,使商家的宣传更加客观. 展示方式多样化 ,增加宣传优势在展示产品或企业时,VR全景可达到 ...
- NSSCTF-finalrce
菜狗的我打开题目之后,人都给我吓傻了,直接过滤的超出了我的认知 菜狗直接就枯了,这个题目其实是不难的,就是比较阴间的一个题目,审计代码,可以看到最后一行的代码"exec($url)&quo ...
- 二叉树的N中遍历方式和拓展应用
(一)创建二叉树,如下图所示,一个标准的二叉树是所有位于根节点的左侧的子节点都是比根节点小的,右侧则都是大于根节点的. public class BinaryNode { public int val ...
- Java常用--反射
反射的意义 你可能说,平时都是业务的增删查改基本用不到反射.但是如果你学会用反射了,可以减少重复代码,非常的好用. 反射是Java语言的一大特性,允许动态的修改程序行为. 代码说反射 1.反射的三个入 ...
- Docker-可视化管理工具总结-推荐使用Portainer
对于初学docker的小白,一款好的可视化工具有助于快速掌握docker基本形态和概念,下面针对docker可视化工具做些总结 ui-for-docker UI For Docker是一个使用Dock ...
- 革命性创新,动画杀手锏 @scroll-timeline
在 CSS 规范 Scroll-linked Animations 中,推出了一个划时代的 CSS 功能.也就是 -- The @scroll-timeline at-rule,直译过来就是滚动时间线 ...
- js json.stringfy()和json.parse()的用法
1.JSON.parse;作用:将JavaScript对象表示法的JSON字符串转换为对象(字符串转对象)语法:JSON.parse(text [, reviver])text 必选. 一个有效的 J ...
- rodert教你学FFmpeg实战这一篇就够了
rodert教你学FFmpeg实战这一篇就够了 建议收藏,以备查阅 pdf阅读版: 链接:https://pan.baidu.com/s/11kIaq5V6A_pFX3yVoTUvzA 提取码:jav ...
- ArcMap操作随记(2)
1.空间校正 变换-仿射 仅发生偏移 橡皮页变化 形状改变 变换-投影 旋转,改变角度 变换-相似 改变大小.形状不变 2.计算行列号 Int(([POINT_Y]-1273.143242)/30)+ ...
- oracle数据库导入导出语句
一.导出: 导出语句: expdp sanyayun/sanyayun@syerpdb directory=DMP dumpfile=fooderp.dmp content=all SCHEMAS=s ...