forked from chairuosen/vue2-ace-editor
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.js
64 lines (55 loc) · 1.49 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
var ace = require('brace');
require(['emmet/emmet'],function (data) {
window.emmet = data.emmet;
});
module.exports = {
template:"<div :style=\"{height: height ? px(height) : '100%',width: width ? px(width) : '100%'}\"></div>",
props:{
value:{
type:String,
required:true
},
lang:String,
theme:String,
height:true,
width:true
},
data: function () {
return {
editor:null,
contentBackup:""
}
},
methods: {
px:function (n) {
if( /^\d*$/.test(n) ){
return n+"px";
}
return n;
}
},
watch:{
value:function (val) {
if(this.contentBackup !== val)
this.editor.setValue(val,1);
}
},
mounted: function () {
var vm = this;
var lang = this.lang||'text';
var theme = this.theme||'chrome';
require('brace/ext/emmet');
var editor = vm.editor = ace.edit(this.$el);
this.$emit('init',editor);
editor.$blockScrolling = Infinity;
editor.setOption("enableEmmet", true);
editor.getSession().setMode('ace/mode/'+lang);
editor.setTheme('ace/theme/'+theme);
editor.setValue(this.value,1);
editor.on('change',function () {
var content = editor.getValue();
vm.$emit('input',content);
vm.contentBackup = content;
});
}
}