首页 > 其他分享 >ckeditor5使用

ckeditor5使用

时间:2022-08-25 17:11:18浏览次数:69  
标签:ckeditor5 console 使用 editor error document getData

//引入
<script src="../view/public/ckeditor5/build/ckeditor.js"></script>
<script src="../view/public/ckeditor5/build/translations/zh.js"></script>

//组件
 <textarea name="editor" id="editor" rows="10" cols="80"></textarea>

init_ckeditor(){
  ClassicEditor.create( document.querySelector( '#editor' ), {
    language: 'zh-cn',
    //移除富文本编辑器的工具栏中部分工具
    removePlugins: ['Italic', 'MediaEmbed'],                 
  } )
  .then( editor => {
    // 记录编辑器对象
    this.editor = editor;
    // 监听内容变化
    editor.model.document.on('change:data', (e) => {
    // 输出当前内容
    console.log(editor.getData())
    document.getElementById('editorcontent').innerHTML = editor.getData();
  })
 } )
 .catch( error => { console.error( error ); } );
},

标签:ckeditor5,console,使用,editor,error,document,getData
From: https://www.cnblogs.com/JaneLifeBlog/p/16624911.html

相关文章

  • localStorge在react中的使用
    1.什么时候用,在哪里用刚获取数据的时候,进行设置,localStorge.setItem(key,value);因为localStorge是用来作为缓存的,且有一定的延时,尤其是在本页面设置本页面使用时,所以,依然......
  • 在本地使用Markdown来写作,自动同步文章笔记到印象笔记(马克飞象替代方案)
    在本地使用 MarkdownPad 、Mark 、Typora 、VSCode 任意你喜欢的 Markdown 编辑器进行文档编写,本工具将自动同步文档到印象笔记。可以当做是马克飞象的替代方案。......
  • vim使用
    把CapsLock映射成。这个操作我建议使用操作系统的改键工具来完成。win下的修改教程链接,mac下直接在系统设置中改即可。不推荐在vim中改是因为系统内修改一次,所有能开启vi......
  • ubuntu查看系统使用内核版本-下载对应源码-国内kernel.org镜像
    查看系统Linux内核版:$apt-cachesearchlinux-source -   下载源码:$sudoapt-getinstalllinux-source-5.3.0 -  下载完成,到/usr/src目录查......
  • Vue项目使用高德地图
    流程:注册账号获取KEY安装使用注册链接:https://lbs.amap.com/选择Web端(JSAPI),同时需要域名限制请按提示进行输入:创建完成后即可看到KEY。安装高德地图JSAPI......
  • 使用{{}}展示或更新页面数据时出现闪烁问题:当网速比较慢时,会让用户先看到表达式{{msg}
    可使用以下方式解决:1、使用v-cloak指令,然后为其设置css样式display:none;即上述代码可修改为:但有时添加完毕后变量仍会显示(即闪烁问题没解决),这是因为v-cloak 的displa......
  • vue2的nextTick使用
    1、关于nextTick。vue中的Dom更新是异步的,是异步的意味着当被处理数据是动态变化时,此时对应的Dom未能及时更新(同步更新)就会导致数据已经更新(model层已经更新)而视力层未更......
  • kibana 使用
    kibana官方地址:https://www.elastic.co/guide/en/kibana/7.8/xpack-security.htmlIndexManagementViewindexsettings,mappings,andstatisticsandperformoperati......
  • Wireshark软件使用教程
    引用网址:https://www.cnblogs.com/cainiao-chuanqi/p/15910553.htmlWireshark是非常流行的网络封包分析软件,可以截取各种网络数据包,并显示数据包详细信息。常用于开发测试......
  • psftp 的使用
    打开工具连接服务器[email protected]  上传和下载分别通过put和get命令来实现:下载上传文件夹,加上那个递归符号-r下载  上传 ......