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 ...
随机推荐
- kali linux中ifconfig命令不能使用的解决办法
1.安装net-tools,因ifconfig属于net-tools,输入命令: sudo apt-get install net-tools 记住加上sudo哦!4647c21ef50df33a ...
- [杂记]如何在LaTeX里插入高亮代码
继上次学会在ppt里面插入带有高亮的c程序代码之后,zyy在这条不归路上越走越远-- 好的,长话短说,今天我介绍的是怎么在LaTeX中插入高亮的c程序代码.(其实不止c程序的代码,别的语言也是可以的, ...
- Vue 源码解读(8)—— 编译器 之 解析(下)
特殊说明 由于文章篇幅限制,所以将 Vue 源码解读(8)-- 编译器 之 解析 拆成了两篇文章,本篇是对 Vue 源码解读(8)-- 编译器 之 解析(上) 的一个补充,所以在阅读时请同时打开 Vu ...
- Qt:自动为class的所有属性生成getter、setter
在类所在的.h文件中,右键类名,Refactor → Create Getter and Setter
- Pycharm:运行程序后显示各种变量的数据栏
右边这个数据栏的显示 在Edit Configurations中勾选Run With Python Console 如果想隐藏:
- MySQL:一些操作
参考:MySQL使用教程 写在开头:语句后都要注意加分号; 1.MySQL服务,在普通的cmd而不是MySQL cmd下进行 --停止MySQL服务 net stop mysql80 --启动MySQ ...
- 数据分析logistic回归与时间序列
logistics回归 1.影响关系研究是所有研究中最为常见的. 2.当y是定量数据时,线性回归可以用来分析影响关系. 3.如果现在想对某件事情发生的概率进行预估,比如一件衣服的是否有人想购买? 这里 ...
- ajax发送json格式与文件数据、django自带的序列化器(了解)
上期内容回顾 聚合查询和分组查询 # 聚合查询 max min sum avg count # 查询关键字:aggregate from django.db.models import Max, Mi ...
- 使用windows自带linux子系统开发esp32
步骤: 1.打开windows商店,搜索ubuntu,安装18.04版本. 2.控制面板 /程序和功能 /打开或关闭windows功能 3.关机重启 4.打开刚安装得ubuntu,设置用户名和密码. ...
- LeetCode-016-最接近的三数之和
最接近的三数之和 题目描述:给定一个包括 n 个整数的数组 nums 和 一个目标值 target.找出 nums 中的三个整数,使得它们的和与 target 最接近.返回这三个数的和.假定每组输入只 ...