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 相关文章推荐
动态加载jQuery的方法
Jun 16 Javascript
JavaScrip调试技巧之断点调试
Oct 22 Javascript
JavaScript识别网页关键字并进行描红的方法
Nov 09 Javascript
JS组件Bootstrap按钮组与下拉按钮详解
May 10 Javascript
基于jQuery的Web上传插件Uploadify使用示例
May 19 Javascript
node.js请求HTTPS报错:UNABLE_TO_VERIFY_LEAF_SIGNATURE\的解决方法
Dec 18 Javascript
Node.js 8 中的 util.promisify的详解
Jun 12 Javascript
vue项目设置scrollTop不起作用(总结)
Dec 21 Javascript
如何解决webpack-dev-server代理常切换问题
Jan 09 Javascript
详解基于Vue的支持数据双向绑定的select组件
Sep 02 Javascript
React冒泡和阻止冒泡的应用详解
Aug 18 Javascript
jQuery中getJSON跨域原理的深入讲解
Sep 02 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
phpcms模块开发之swfupload的使用介绍
2013/04/28 PHP
ThinkPHP 模板substr的截取字符串函数详解
2017/01/09 PHP
php函数式编程简单示例
2019/08/08 PHP
js 屏蔽鼠标右键脚本附破解方法
2009/12/03 Javascript
jquery multiSelect 多选下拉框
2010/07/09 Javascript
JavaScript 对象模型 执行模型
2010/10/15 Javascript
浅析javascript闭包 实例分析
2010/12/25 Javascript
html组件不可输入(只读)同时任何组件都有效
2013/04/01 Javascript
鼠标经过tr时,改变tr当前背景颜色
2014/01/13 Javascript
JS实现方向键切换输入框焦点的方法
2015/08/19 Javascript
JS+CSS实现仿雅虎另类滑动门切换效果
2015/10/13 Javascript
JS定时器用法分析【时钟与菜单中的应用】
2016/12/21 Javascript
ES6新特性五:Set与Map的数据结构实例分析
2017/04/21 Javascript
浅谈angularjs依赖服务注入写法的注意点
2017/04/24 Javascript
使用vue-resource进行数据交互的实例
2017/09/02 Javascript
AngularJS基于http请求实现下载php生成的excel文件功能示例
2018/01/23 Javascript
关于redux-saga中take使用方法详解
2018/02/27 Javascript
JQuery样式操作、click事件以及索引值-选项卡应用示例
2019/05/14 jQuery
微信小程序wx.navigateTo方法里的events参数使用详情及场景
2020/01/07 Javascript
[02:43]DOTA2英雄基础教程 半人马战行者
2014/01/13 DOTA
python 多个参数不为空校验方法
2019/02/14 Python
python轮询机制控制led实例
2020/05/03 Python
AmazeUI图片轮播效果的示例代码
2020/08/20 HTML / CSS
expedia比利时:预订航班+酒店并省钱
2018/07/13 全球购物
Fresh馥蕾诗英国官网:法国LVMH集团旗下高端天然护肤品牌
2018/11/01 全球购物
研究生求职推荐信范文
2013/11/30 职场文书
安全资料员岗位职责
2013/12/14 职场文书
《小蝌蚪找妈妈》教学反思
2014/02/21 职场文书
《在山的那边》教学反思
2014/02/23 职场文书
银行柜员求职自荐书
2014/06/18 职场文书
客户经理岗位职责大全
2015/04/09 职场文书
二审代理词范文
2015/05/25 职场文书
结婚主持人致辞
2015/07/28 职场文书
导游词之五台山
2019/10/11 职场文书
导游词之山东八仙过海景区
2019/11/11 职场文书
java版 简单三子棋游戏
2022/05/04 Java/Android