vue中使用codemirror的实例详解


Posted in Javascript onNovember 01, 2018

这篇文章在vue里使用codemirror遇到的问题,写的很不错,还有下载的方法,大家可以点击查看。

以下是自己使用过的,做出来的例子:

做出来的效果图:

vue中使用codemirror的实例详解

记住使用之前要npm下载哦

npm install vue-codemirror --save

main.js

import { codemirror } from 'vue-codemirror'
import 'codemirror/lib/codemirror.css'

Vue.use(VueCodemirror)

再到组件中使用 

import { codemirror } from 'vue-codemirror'

require("codemirror/mode/python/python.js")

require('codemirror/addon/fold/foldcode.js')

require('codemirror/addon/fold/foldgutter.js')

require('codemirror/addon/fold/brace-fold.js')

require('codemirror/addon/fold/xml-fold.js')

require('codemirror/addon/fold/indent-fold.js')

require('codemirror/addon/fold/markdown-fold.js')

require('codemirror/addon/fold/comment-fold.js')

vue中使用codemirror的实例详解

当然组件需要先声明

components:{


codemirror

}

 html代码这样写:

vue中使用codemirror的实例详解

vue中使用codemirror的实例详解

js:

vue中使用codemirror的实例详解

 vue中使用codemirror的实例详解

style:

vue中使用codemirror的实例详解

总结

以上所述是小编给大家介绍的vue中使用codemirror的实例详解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript中字符串替换函数replace()方法与c# 、vb 替换有一点不同
Jun 25 Javascript
理解Javascript_01_理解内存分配原理分析
Oct 11 Javascript
Javascript中的delete操作符详细介绍
Jun 06 Javascript
jQuery实现文本展开收缩特效
Jun 03 Javascript
iOS和Android用同一个二维码实现跳转下载链接的方法
Sep 28 Javascript
JS回调函数基本定义与用法实例分析
May 24 Javascript
JS计算两个时间相差分钟数的方法示例
Jan 10 Javascript
详解webpack-dev-server的简单使用
Apr 02 Javascript
vue2.0 可折叠列表 v-for循环展示的实例
Sep 07 Javascript
解决vue axios的封装 请求状态的错误提示问题
Sep 25 Javascript
JS造成内存泄漏的几种情况实例分析
Mar 02 Javascript
Node.js文本文件BOM头的去除方法
Nov 22 Javascript
vue-lazyload使用总结(推荐)
Nov 01 #Javascript
vue 中基于html5 drag drap的拖放效果案例分析
Nov 01 #Javascript
Vue列表渲染的示例代码
Nov 01 #Javascript
socket io与vue-cli的结合使用的示例代码
Nov 01 #Javascript
Vue表单输入绑定的示例代码
Nov 01 #Javascript
浅谈Angular 观察者模式理解
Nov 01 #Javascript
详解vuex状态管理模式
Nov 01 #Javascript
You might like
PHP合并数组+与array_merge的区别分析
2010/08/01 PHP
解析strtr函数的效率问题
2013/06/26 PHP
PHP随机生成信用卡卡号的方法
2015/03/23 PHP
10个php函数实用却不常见
2015/10/13 PHP
php可变长参数处理函数详解
2017/02/22 PHP
PHP简单读取xml文件的方法示例
2017/04/20 PHP
php无限极分类实现方法分析
2019/07/04 PHP
laravel 模型查询按照whereIn排序的示例
2019/10/16 PHP
如何在Laravel5.8中正确地应用Repository设计模式
2019/11/26 PHP
JS左右无缝滚动(一般方法+面向对象方法)
2012/08/17 Javascript
canvas 画布在主流浏览器中的尺寸限制详细介绍
2016/12/15 Javascript
微信小程序 WebSocket详解及应用
2017/01/21 Javascript
从零学习node.js之文件操作(三)
2017/02/21 Javascript
JS实现简易刻度时钟示例代码
2017/03/11 Javascript
整理关于Bootstrap表单的慕课笔记
2017/03/29 Javascript
利用jQuery实现简单的拖曳效果实例代码
2017/10/20 jQuery
JavaScript数据结构之单链表和循环链表
2017/11/28 Javascript
Vue 进阶之路(三)
2019/04/18 Javascript
[03:40]DOTA2亚洲邀请赛小组赛第二日 赛事回顾
2015/01/31 DOTA
在Python中处理字符串之isdigit()方法的使用
2015/05/18 Python
Python时间模块datetime、time、calendar的使用方法
2016/01/13 Python
python获取当前用户的主目录路径方法(推荐)
2017/01/12 Python
Python读取stdin方法实例
2019/05/24 Python
python flask框架实现传数据到js的方法分析
2019/06/11 Python
twilio python自动拨打电话,播放自定义mp3音频的方法
2019/08/08 Python
wxpython+pymysql实现用户登陆功能
2019/11/19 Python
如何基于Python爬虫爬取美团酒店信息
2020/11/03 Python
无谷物狗粮:Pooch & Mutt
2018/05/23 全球购物
世界上最大的铁人三项商店:Tri UK
2020/11/04 全球购物
几道数据库的面试题或笔试题
2014/05/31 面试题
毕业生多媒体设计求职信
2013/10/12 职场文书
祖国在我心中演讲稿450字
2014/09/05 职场文书
2014旅游局党组书记党建工作汇报材料
2014/11/02 职场文书
2015年学校办公室工作总结
2015/05/26 职场文书
使用这 6个Vue加载动画库来减少我们网站的跳出率
2021/05/18 Vue.js
CDPR谈《巫师》新作用虚幻5原因 称不会为Epic独占
2022/04/06 其他游戏