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 相关文章推荐
JS 获取span标签中的值的代码 支持ie与firefox
Aug 24 Javascript
javascript限制文本框只允许输入数字(曾经与现在的方法对比)
Jan 18 Javascript
jQuery 获取、设置HTML或TEXT内容的两种方法
May 23 Javascript
Javascript中实现String.startsWith和endsWith方法
Jun 10 Javascript
Angularjs使用过滤器完成排序功能
Sep 20 Javascript
javascript+html5+css3自定义弹出窗口效果
Oct 26 Javascript
深入解析koa之异步回调处理
Jun 17 Javascript
vue实现将数据存入vuex中以及从vuex中取出数据
Nov 08 Javascript
JavaScript canvas仿代码流瀑布
Feb 10 Javascript
js找出5个数中最大的一个数和倒数第二大的数实现方法示例小结
Mar 04 Javascript
JavaScript Event Loop相关原理解析
Jun 10 Javascript
纯js+css实现在线时钟
Aug 18 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与ASP
2006/10/09 PHP
PHP伪静态页面函数附使用方法
2008/06/20 PHP
晋城吧对DiscuzX进行的前端优化要点
2010/09/05 PHP
php include和require的区别深入解析
2013/06/17 PHP
弹出广告特效代码(一个IP只弹出一次)
2007/05/11 Javascript
JavaScript 类似flash效果的立体图片浏览器
2010/02/08 Javascript
javascript中style.left和offsetLeft的用法说明
2014/03/07 Javascript
使用CSS+JavaScript或纯js实现半透明遮罩效果的实例分享
2016/05/09 Javascript
AngularJS动态生成div的ID源码解析
2016/08/29 Javascript
javascript实现的左右无缝滚动效果
2016/09/19 Javascript
js正则表达式注册页面表单验证
2016/10/11 Javascript
Angular2 PrimeNG分页模块学习
2017/01/14 Javascript
浅谈Vue SPA 首屏加载优化实践
2017/12/15 Javascript
详解Vue结合后台的列表增删改案例
2018/08/21 Javascript
JQuery Ajax跨域调用和非跨域调用问题实例分析
2019/04/16 jQuery
vue 项目build错误异常的解决方法
2019/04/22 Javascript
Vue编写可显示周和月模式的日历 Vue自定义日历内容的显示
2019/06/26 Javascript
详解基于Wepy开发小程序插件(推荐)
2019/08/01 Javascript
Vue.js页面中有多个input搜索框如何实现防抖操作
2019/11/04 Javascript
一篇文章带你浅入webpack的DLL优化打包
2020/02/20 Javascript
vue 获取url里参数的两种方法小结
2020/11/12 Javascript
布同 Python中文问题解决方法(总结了多位前人经验,初学者必看)
2011/03/13 Python
python算法学习之基数排序实例
2013/12/18 Python
机器学习的框架偏向于Python的13个原因
2017/12/07 Python
opencv3/C++实现视频背景去除建模(BSM)
2019/12/11 Python
Django调用支付宝接口代码实例详解
2020/04/04 Python
解决tensorflow 释放图,删除变量问题
2020/06/23 Python
Python变量格式化输出实现原理解析
2020/08/06 Python
详解HTML5 canvas绘图基本使用方法
2018/01/29 HTML / CSS
Charles & Keith欧盟:新加坡时尚品牌
2019/08/01 全球购物
电子商务应届生自我鉴定
2014/01/13 职场文书
小学生暑假家长评语
2014/04/17 职场文书
关心下一代工作先进事迹
2014/08/15 职场文书
纪委立案决定书
2015/06/24 职场文书
2016年小学生寒假总结
2015/10/10 职场文书
Django使用redis配置缓存的方法
2021/06/01 Redis