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的跟随屏幕滚动代码
Jul 24 Javascript
Struts2的s:radio标签使用及用jquery添加change事件
Apr 08 Javascript
JavaScript数组去重的3种方法和代码实例
Jul 01 Javascript
js实现仿微博滚动显示信息的效果
Dec 21 Javascript
js简单倒计时实现代码
Apr 30 Javascript
Javascript 实现放大镜效果实例详解
Dec 03 Javascript
详解如何在你的Vue项目配置vux
Jun 04 Javascript
jQuery实现导航样式布局操作示例【可自定义样式布局】
Jul 24 jQuery
微信小程序动态设置图片大小的方法
Nov 21 Javascript
vue实现短信验证码输入框
Apr 17 Javascript
VUE 项目在IE11白屏报错 SCRIPT1002: 语法错误的解决
Sep 27 Javascript
JavaScript中的Proxy对象
Nov 27 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 Undefined index的问题
2009/06/01 PHP
基于php常用正则表达式的整理汇总
2013/06/08 PHP
php比较两个绝对时间的大小
2014/01/31 PHP
WordPress开发中短代码的实现及相关函数使用技巧
2016/01/05 PHP
thinkPHP框架实现的简单计算器示例
2018/12/07 PHP
jQuery 一个图片切换的插件
2011/10/09 Javascript
整理AngularJS中的一些常用指令
2015/06/16 Javascript
轻松学习jQuery插件EasyUI EasyUI创建CRUD应用
2015/11/30 Javascript
BootStrap Table 设置height表头与内容无法对齐的问题
2016/12/28 Javascript
详解nodejs中的process进程
2017/03/19 NodeJs
使用Bootstrap打造特色进度条效果
2017/05/02 Javascript
vue脚手架及vue-router基本使用
2018/04/09 Javascript
node中的cookie的具体使用
2018/09/13 Javascript
JS实现二维数组元素的排列组合运算简单示例
2019/01/28 Javascript
基于node简单实现RSA加解密的方法步骤
2019/03/21 Javascript
vue实现pdf文档在线预览功能
2019/11/26 Javascript
在JavaScript中查找字符串中最长单词的三种方法(推荐)
2021/01/18 Javascript
python中私有函数调用方法解密
2016/04/29 Python
python GUI库图形界面开发之PyQt5布局控件QHBoxLayout详细使用方法与实例
2020/03/06 Python
Python面向对象魔法方法和单例模块代码实例
2020/03/25 Python
基于Python爬取素材网站音频文件
2020/10/21 Python
python脚本使用阿里云slb对恶意攻击进行封堵的实现
2021/02/04 Python
澳大利亚最受欢迎的美发和美容在线商店:Catwalk
2018/12/12 全球购物
什么是Rollback Segment
2013/04/22 面试题
公共事业管理本科生求职信
2013/10/07 职场文书
修理厂厂长岗位职责
2014/01/30 职场文书
2014年幼儿园植树节活动方案
2014/03/02 职场文书
金融学专业大学生职业生涯规划
2014/03/07 职场文书
公共场所禁烟倡议书
2014/08/30 职场文书
2014小学一年级班主任工作总结
2014/12/05 职场文书
2015年工程部工作总结
2015/04/30 职场文书
狂人日记读书笔记
2015/06/30 职场文书
公司保洁员管理制度
2015/08/04 职场文书
深入探讨opencv图像矫正算法实战
2021/05/21 Python
记一次Mysql不走日期字段索引的原因小结
2021/10/24 MySQL
SpringBoot2零基础到精通之数据与页面响应
2022/03/22 Java/Android