1遍搞、介紹
Ace是一個用JavaScript編寫的可嵌入代碼編輯器。它與Sublime，Vim和TextMate等本機編輯器的功能和性能相匹配辐董。它可以輕松地嵌入任何網(wǎng)頁和JavaScript應(yīng)用程序中扫尖。
2白对、在項目中配置Ace
// 將代碼模式配置到ace選項
ace.edit(element, {
mode: "ace/mode/javascript",
selectionStyle: "text"
})
// 使用setOptions方法一次設(shè)置多個選項
editor.setOptions({
autoScrollEditorIntoView: true,
copyWithEmptySelection: true,
});
// 單獨設(shè)置setOptions方法
editor.setOption("mergeUndoDeltas", "always");
// 一些選項也直接設(shè)置，例如：
editor.setTheme(...)
// 獲取選項設(shè)置值
editor.getOption("optionName");
// 核心Ace組件包括（editor, session, renderer, mouseHandler）
setOption(optionName, optionValue)
setOptions({
optionName : optionValue
})
getOption(optionName)
getOptions()
3换怖、API選項
以下是目前所有支持的選項的列表甩恼。除非另有說明，否則選項值皆為布爾值沉颂，可以通過editor.setOption來設(shè)置条摸。
3.1 editor選項
| 選項名 |
值類型 |
默認值 |
可選值 |
備注 |
| selectionStyle |
String |
text |
line|text |
選中樣式 |
| highlightActiveLine |
Boolean |
true |
- |
高亮當(dāng)前行 |
| highlightSelectedWord |
Boolean |
true |
- |
高亮選中文本 |
| readOnly |
Boolean |
false |
- |
是否只讀 |
| cursorStyle |
String |
ace |
ace|slim|smooth|wide |
光標(biāo)樣式 |
| mergeUndoDeltas |
String|Boolean |
false |
always |
合并撤銷 |
| behavioursEnabled |
Boolean |
true |
- |
啟用行為 |
| wrapBehavioursEnabled |
Boolean |
true |
- |
啟用換行 |
| autoScrollEditorIntoView |
Boolean |
false |
- |
啟用滾動 |
| copyWithEmptySelection |
Boolean |
true |
- |
復(fù)制空格 |
| useSoftTabs |
Boolean |
false |
- |
使用軟標(biāo)簽 |
| navigateWithinSoftTabs |
Boolean |
false |
- |
軟標(biāo)簽跳轉(zhuǎn) |
| enableMultiselect |
Boolean |
false |
- |
選中多處 |
3.2 renderer選項
| 選項名 |
值類型 |
默認值 |
可選值 |
備注 |
| hScrollBarAlwaysVisible |
Boolean |
false |
- |
縱向滾動條始終可見 |
| vScrollBarAlwaysVisible |
Boolean |
false |
- |
橫向滾動條始終可見 |
| highlightGutterLine |
Boolean |
true |
- |
高亮邊線 |
| animatedScroll |
Boolean |
false |
- |
滾動動畫 |
| showInvisibles |
Boolean |
false |
- |
顯示不可見字符 |
| showPrintMargin |
Boolean |
false |
- |
顯示打印邊距 |
| printMarginColumn |
Number |
80 |
- |
設(shè)置頁邊距 |
| printMargin |
Boolean|Number |
false |
- |
顯示并設(shè)置頁邊距 |
| fadeFoldWidgets |
Boolean |
false |
- |
淡入折疊部件 |
| showFoldWidgets |
Boolean |
true |
- |
顯示折疊部件 |
| showLineNumbers |
Boolean |
true |
- |
顯示行號 |
| showGutter |
Boolean |
true |
- |
顯示行號區(qū)域 |
| displayIndentGuides |
Boolean |
true |
- |
顯示參考線 |
| fontSize |
Number|String |
inherit |
- |
設(shè)置字號 |
| fontFamily |
String |
inherit |
|
設(shè)置字體 |
| maxLines |
Number |
- |
- |
至多行數(shù) |
| minLines |
Number |
- |
- |
至少行數(shù) |
| scrollPastEnd |
Boolean|Number |
0 |
- |
滾動位置 |
| fixedWidthGutter |
Boolean |
false |
- |
固定行號區(qū)域?qū)挾?/td>
|
| theme |
String |
- |
- |
主題引用路徑，例如"ace/theme/textmate" |
3.3 mouseHandler選項
| 選項名 |
值類型 |
默認值 |
可選值 |
備注 |
| scrollSpeed |
Number |
- |
- |
滾動速度 |
| dragDelay |
Number |
- |
- |
拖拽延時 |
| dragEnabled |
Boolean |
true |
- |
是否啟用拖動 |
| focusTimout |
Number |
- |
- |
聚焦超時 |
| tooltipFollowsMouse |
Boolean |
false |
- |
鼠標(biāo)提示 |
3.4 session選項
| 選項名 |
值類型 |
默認值 |
可選值 |
備注 |
| firstLineNumber |
Number |
1 |
- |
起始行號 |
| overwrite |
Boolean |
- |
- |
重做 |
| newLineMode |
String |
auto |
auto|unix|windows |
新開行模式 |
| useWorker |
Boolean |
- |
- |
使用輔助對象 |
| useSoftTabs |
Boolean |
- |
- |
使用軟標(biāo)簽 |
| tabSize |
Number |
- |
- |
標(biāo)簽大小 |
| wrap |
Boolean |
- |
- |
換行 |
| foldStyle |
String |
- |
markbegin|markbeginend|manual |
折疊樣式 |
| mode |
String |
- |
- |
代碼匹配模式铸屉，例如“ace/mode/text" |
3.5 擴展選項
| 選項名 |
值類型 |
默認值 |
可選值 |
備注 |
| enableBasicAutocompletion |
Boolean |
- |
- |
啟用基本自動完成 |
| enableLiveAutocompletion |
Boolean |
- |
- |
啟用實時自動完成 |
| enableSnippets |
Boolean |
- |
- |
啟用代碼段 |
| enableEmmet |
Boolean |
- |
- |
啟用Emmet |
| useElasticTabstops |
Boolean |
- |
- |
使用彈性制表位 |
轉(zhuǎn)載于：http://www.reibang.com/p/fb49c843a679
