编程语言CKEditor 4编辑器已与Vue.js集成

    作者:局长更新于: 2020-02-20 14:32:28

    大神带你学编程,欢迎选课

    CKEditor 4编辑器已与Vue.js集成。编程语言原本是被设计成专门使用在计算机上的,但它们也可以用来定义算法或者数据结构。正是因为如此,程序员才会试图使程序代码更容易阅读。

    虽然 CKEditor 4 不是目前主要维护的分支,不过官方并没有让它落后于潮流。近日,CKEditor 团队发布了与 Vue.js 框架原生集成的 CKEditor 4。

    编程语言CKEditor 4编辑器已与Vue.js集成_编程语言_Java_Javascript_课课家

    这就意味着,开发者可以通过标签以 Vue.js 组件的形式使用 CKEditor 4 ,而作为 Vue.js 的原生组件,开发者可以更快地将其应用到网站上。

    为了尽可能简单直观地安装使用 CKEditor 4,集成 Vue.js 的 CKEditor 4 已在 npm 和 CDN 中提供,也可通过 zip 包使用。

    根据官方的介绍,CKEditor 4 只是一个 Javascript 富文本编辑组件,与大家熟知的 JavaScript 框架都兼容,它没有使用小众技术或要求在不常见的环境中运行。只要开发者使用的框架没有奇怪的限制,CKEditor 4 都能与其兼容。

    浏览器支持

    CKEditor 4 Vue 组件可在除 Internet Explorer 之外的所有受支持的浏览器中使用。

    注意:即使 CKEditor 4 支持包括 IE8、IE9 和 IE10 在内的较旧 Internet Explorer 版本,但集成 Vue 的 CKEditor 4 仅支持在最新的 Internet Explorer 11 中使用。

    要启用对 Internet Explorer 11 的支持,不应采用标准导入的方式,而是需要导入一个包含所有必需的 polyfill 的特定文件dist/legacy.js:

    1. import CKEditor from 'ckeditor4-vue/dist/legacy.js' 

    安装和使用

    要从 npm 安装 Vue.js 的 CKEditor 4 组件,只需运行:

    1. npm install ckeditor4-vue 

    安装完成后将其导入项目中,并通过调用Vue.use()方法进行使用:

    1. import Vue from 'vue';  
    2. import CKEditor from 'ckeditor4-vue';  
    3. Vue.use( CKEditor );  
    4. new Vue( {  
    5.     // ... options  
    6. } ) 

    然后应在模板中添加标签以创建 CKEditor 4 实例:

    1. <template>  
    2.   <div id="app">  
    3.     <ckeditor value="Hello, World!">ckeditor>  
    4.   div>  
    5. template> 

    上面代码中使用的value属性负责设置初始的编辑器数据。

    编程语言往往使程序员能够比使用机器语言更准确地表达他们所想表达的目的。对那些从事计算机科学的人来说,懂得程序设计语言是十分重要的,因为在当今所有的计算都需要程序设计语言才能完成。

课课家教育

未登录