ace-editor线上代码编辑器

package.json

{
"name": "vue-cli",
"version": "1.0.0",
"description": "A Vue.js project",
"author": "[email protected]",
"private": true,
"scripts": {
...
},
"dependencies": {
...
},
"devDependencies": {
...

"brace": "^0.11.0",
"emmet": "git+https://github.com/cloud9ide/emmet-core.git",
...
},
"engines": {
...
},
"browserslist": [
...
]
}

component文件夹——>editor.vue文件

view文件夹的 你的页面文件

 

methods:{
　　editorInit(){
　　　　require('brace/mode/mysql')
　　　　require('brace/theme/xcode')
　　},
　　setCompletions (editor, session, pos, prefix, callback) {//自动提示方法
　　　　callback(null, this.wordList.map(function (word) {
　　　　　　return {
　　　　　　　　caption: word.vl,
　　　　　　　　value: word.vl,
　　　　　　　　meta: word.meta
　　　　　　}
　　　　}))
　　},
}

mounted(){
　　if(!!configHighlight){//输入提示
　　　　for (let i of configHighlight.split('|')) {
　　　　　　this.wordList.push({'vl': i, 'meta': '关键字'})
　　　　}
　　}
}

转载于:https://www.cnblogs.com/MisterHe/p/10465963.html