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的tab切换效果代码[代码分离]
Apr 11 Javascript
js锁屏解屏通过对$.ajax进行封装实现
Jul 31 Javascript
基于Jquery制作图片文字排版预览效果附源码下载
Nov 18 Javascript
jquery实现表单验证简单实例演示
Nov 23 Javascript
js for终止循环 跳出多层循环
Oct 04 Javascript
玩转Koa之koa-router原理解析
Dec 29 Javascript
详解JavaScript实现动态的轮播图效果
Apr 29 Javascript
layui表格 列自动适应大小失效的解决方法
Sep 06 Javascript
Angular6项目打包优化的实现方法
Dec 15 Javascript
微信jssdk踩坑之签名错误invalid signature
May 19 Javascript
vue中v-for循环选中点击的元素并对该元素添加样式操作
Jul 17 Javascript
design vue 表格开启列排序的操作
Oct 28 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验证码类(分享)
2013/08/06 PHP
laravel5.2表单验证,并显示错误信息的实例
2019/09/29 PHP
兼容多浏览器的字幕特效Marquee的通用js类
2008/07/20 Javascript
jquery 取子节点及当前节点属性值的方法
2014/08/24 Javascript
Javascript 多物体运动的实现
2014/12/24 Javascript
JavaScript获取两个数组交集的方法
2015/06/09 Javascript
jQuery+css3实现Ajax点击后动态删除功能的方法
2015/08/10 Javascript
jQuery实现鼠标双击Table单元格变成文本框及输入内容后更新到数据库的方法
2015/11/25 Javascript
jQuery实现Select左右复制移动内容
2016/08/05 Javascript
jQuery常用样式操作实例分析(获取、设置、追加、删除、判断等)
2016/09/08 Javascript
微信小程序 教程之WXML
2016/10/18 Javascript
vue实现未登录跳转到登录页面的方法
2018/07/17 Javascript
解决Vue watch里调用方法的坑
2020/11/07 Javascript
微信小程序实现页面左右滑动
2020/11/16 Javascript
微信小程序选择图片控件
2021/01/19 Javascript
[04:52]DOTA2亚洲邀请赛附加赛 TOP10精彩集锦
2015/01/29 DOTA
python+opencv实现动态物体识别
2018/01/09 Python
python实现超简单的视频对象提取功能
2018/06/04 Python
python爬取cnvd漏洞库信息的实例
2019/02/14 Python
python+pyqt5实现图片批量缩放工具
2019/03/18 Python
Django models.py应用实现过程详解
2019/07/29 Python
利用Python代码实现一键抠背景功能
2019/12/29 Python
PyTorch中反卷积的用法详解
2019/12/30 Python
美国值得信赖的婚恋交友网站:eHarmony
2018/10/04 全球购物
Pretty You London官网:英国拖鞋和睡衣品牌
2019/05/08 全球购物
外贸主管求职简历的自我评价
2013/10/23 职场文书
技术总监管理职责范本
2014/03/06 职场文书
会计员岗位职责
2014/03/15 职场文书
态度决定一切演讲稿
2014/05/20 职场文书
2014年党员承诺书范文
2014/05/20 职场文书
家庭教育的心得体会
2014/09/01 职场文书
认错检讨书
2014/10/02 职场文书
合同和协议有什么区别?
2014/10/08 职场文书
任命书标准格式
2015/03/02 职场文书
公司晚会主持词
2019/04/17 职场文书
送给火锅店的创意营销方案!
2019/07/08 职场文书