Skip to content

代码编辑器

基于vue-codemirror的二次封装,目前使用的是 v6 版本。vue-codemirror帮助我们把codemirrorvue建立了一个很好的桥接。相信我,如果你打算单独使用codemirror,困难会不少的。codemirror的 api 设计的很大佬,文档也是很大佬,比较难于阅读。所以我更倾向于直接使用vue-codemirror

前一阵开始用的时候发现vue-codemirror没把国际化的配置传递进codemirror,于是提了个pr,一下就通过了。vue-codemirror作者也算开源社区的牛人了,感兴趣的可以关注一下。

Usage

做的也是十分简单的封装。说实话如果真有这种组件需求的业务,可能需要很多高度自定义的东西,so,这个组件只是个例子,完全可以在此基础上进行修改。

目前只添加了javascript的 language 支持,同时添加了一个自动补全的示例,这些具体都需要到codeMirror的官网文档进行查看。

vue
<template>
  <w-code-mirror v-model:value="code" />
</template>

Props

名称类型默认值说明
valuestring-双向绑定
disabledbooleanfalse禁用
heightstring-高度
placeholderstring-占位
autofocusbooleanfalse自动聚焦

Type

Form Usage

TODO

  • 通用:支持 cdn 用法,为那些需要减小打包体积的开发者

Released under the MIT License.