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 验证上传图片大小[客户端]
Aug 01 Javascript
jquery jqPlot API 中文使用教程(非常强大的图表工具)
Aug 15 Javascript
js Function类型
Dec 04 Javascript
JS中for循序中延迟加载动态效果的具体实现
Aug 18 Javascript
toggle()隐藏问题的解决方法
Feb 17 Javascript
jquery地址栏链接与a标签链接匹配之特效代码总结
Aug 24 Javascript
js性能优化技巧
Nov 29 Javascript
Javascript中神奇的this
Jan 20 Javascript
浅谈Javascript中的函数、this以及原型
Oct 09 Javascript
Javascript DOM事件操作小结(监听鼠标点击、释放,悬停、离开等)
Jan 20 Javascript
基于vue实现swipe轮播组件实例代码
May 24 Javascript
jQuery Datatables表头不对齐的解决办法
Nov 27 jQuery
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+mysql写的简单留言本实例代码
2008/07/25 PHP
基于PHP Socket配置以及实例的详细介绍
2013/06/13 PHP
ThinkPHP分页实例
2014/10/15 PHP
PHP设计模式之迭代器模式
2016/06/17 PHP
php微信开发之音乐回复功能
2018/06/14 PHP
破除一些网站复制、右键限制
2006/11/04 Javascript
js实现带搜索功能的下拉框实时搜索实时匹配
2013/11/05 Javascript
基于编写jQuery的无缝滚动插件
2014/08/02 Javascript
JS去除iframe滚动条的方法
2015/04/01 Javascript
Javascript验证方法大全
2015/09/21 Javascript
学习使用bootstrap3栅格系统
2016/04/12 Javascript
使用jQuery调用XML实现无刷新即时聊天
2016/08/07 Javascript
jQuery实现动态文字搜索功能
2017/01/05 Javascript
js实现用户输入的小写字母自动转大写字母的方法
2017/01/21 Javascript
微信小程序scroll-view实现横向滚动和上拉加载示例
2017/03/06 Javascript
基于nodejs 的多页面爬虫实例代码
2017/05/31 NodeJs
AngularJS模糊查询功能实现代码(过滤内容下拉菜单排序过滤敏感字符验证判断后添加表格信息)
2017/10/24 Javascript
微信小程序实现全国机场索引列表
2018/01/31 Javascript
vue 登录滑动验证实现代码
2018/08/24 Javascript
详解Vue中组件传值的多重实现方式
2019/08/16 Javascript
解决layer.open弹出框不能获取input框的值为空的问题
2019/09/10 Javascript
Node.js API详解之 timer模块用法实例分析
2020/05/07 Javascript
解决Echarts2竖直datazoom滑动后显示数据不全的问题
2020/07/20 Javascript
[41:05]Serenity vs Pain 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
python ChainMap的使用和说明详解
2019/06/11 Python
4行Python代码生成图像验证码(2种)
2020/04/07 Python
python多线程实现同时执行两个while循环的操作
2020/05/02 Python
python中threading和queue库实现多线程编程
2021/02/06 Python
CSS3悬停效果案例应用
2012/11/21 HTML / CSS
您的健身减肥和健康饮食专家:vitafy
2017/06/06 全球购物
医学专业本科毕业生自我鉴定
2013/12/28 职场文书
大学班长的职责
2014/01/27 职场文书
简历里的自我评价
2014/01/31 职场文书
网络工程师职业规划
2014/02/10 职场文书
房屋出租委托书格式
2014/09/23 职场文书
八月一日观后感
2015/06/10 职场文书