Vue之vue2-ace-editor代码编辑器使用方式


1、安装

npm install --save-dev vue2-ace-editor

2.1、全局加载:main.js 进行组件全局加载

import Editor from 'vue2-ace-editor'
Vue.component('editor', Editor)

2.2、组件单独加载

import Editor from 'vue2-ace-editor'
components: {
    Editor
}

3、组件引入editor代码编辑器

<editor
  height="500" 
  width="500"
  ref="editor" 
  :content="content" 
  v-model="content"
  :options="{
      enableBasicAutocompletion: true,
      enableSnippets: true,
      enableLiveAutocompletion: true,
      tabSize:6,
      fontSize:14,
      showPrintMargin:false,   //去除编辑器里的竖线
   }"
   :lang="'html'"
   @init="editorInit">
</editor>

 --仅用作学习记录


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM