vue集成CKEditor构建框架的使用,遇到富文本框不出现工具栏等操作
2024-10-19 12:01:20
官方关于Vue集成CKEditor富文本框的文档:https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/frameworks/vuejs.html#using-es6-modules
先说下依赖吧,
"@ckeditor/ckeditor5-vue" 这个是使用vue集成的时候,这个依赖必不可缺,当然,如果你是直接使用script脚本引入的话,这个依赖也不是必须的,通过ckeditor在线构建出的压缩包里面就有一个例子,不过是 内联脚本 版本的。
说下我遇到的问题, 集成官方提供的ckeditor版本可以正常使用,主要就是 引入
"@ckeditor/ckeditor5-vue"依赖和 npm install --save @ckeditor/ckeditor5-build-classic 安装的版本,照文档的操作就可以正常使用,但是我认为这里面包含的ckfinder功能我不是需要的,所以,我就是用官方提供的在线构建器,选择需要的功能。
,当通过 npm folder形式进行安装后,使用的问题情况是 页面里并没有出现工具栏和悬浮菜单框,通过查看提供的例子,里面是需要配置的,所以,通过vue配置一下就可以正常使用了
总结的就一句话,官方提供的ckeditor版本可以照着官方文档就可以正常使用;而通过ckeditor提供的在线构建器构建的版本,这个配置项不可或缺,不然,页面不会出现菜单项。
这个是单文件组件的data项,Vue.use(CKEditor) 就可以使用这个组件了
<ckeditor :editor="editor" v-model="editorData" :config="editorConfig"></ckeditor>
至关重要的一句话啊,放在了API中说明。。。
最新文章
- SQLite 创建自增长标识列
- SCSS
- 在用EF新增对象存贮至数据库时汪报错,但数据库里没有新增数据
- 移动端-弹窗demo
- Python 得到Twitter所有用户friends和followers
- 去掉UITableView HeaderView或FooterView随tableView 移动的黏性
- 如何将md文件转换成带目录的html文件
- C# 反向生成工具(DAL BLL Modle)
- mock详解
- JLOI2016 简要题解
- javascript面向对象学习
- LiDAR、LAS、LAS Dataset与点云
- centos ssh终端下高亮显示git分支名
- svn提交遇到冲突解决方法
- javascript继承之借用构造函数(二)
- PowerDesigner :
- Unreal Enginer4特性介绍
- Okhttp实用封装
- http协议及http协议和tcp协议的区别
- linux shell 自定义函数(定义、返回值、变量作用域)介绍