使用vue2-ace-editor代码编辑器,要求不能换行,只能输入一行代码。
下面是我做的尝试中唯一一个接近真相的......
html:
<ace-editor
ref="aceEditor"
v-model="item.parameterValue"
class="ace-editor"
height="144"
width="100%"
lang="yaml"
theme="monokai"
:options="editorOptions"
@init="editorInit"
/>
js
editorInit() {
require('brace/theme/monokai');
require('brace/theme/clouds');
require('brace/ext/language_tools');
require('brace/mode/java');
require('brace/snippets/java');
require('brace/theme/eclipse');
require('brace/mode/yaml');
require('brace/mode/properties');
require('brace/snippets/json');
this.$refs.aceEditor[0].editor.setShowFoldWidgets(true);
this.$refs.aceEditor[0].editor.commands.addCommand({
name: 'preventNewline',
bindKey: { win: 'Enter', mac: 'Enter', linux: 'Enter' },
exec: editor => {
// 阻止 Enter 键的默认行为(即插入换行符)
let value = editor.getValue();
value = value.replace(/\r\n|\r|\n/g, '');
editor.getSession().setValue(value);
return false;
},
readOnly: true, // 这个命令在只读模式下也有效
});
}
采用了addCommand的方法,但是发现赋值的时候会默认跳到第二行。