inspector.js 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. // 暂无实现
  2. const ace = Editor.require('packages://simple-code/ace/ace.js');
  3. const language_tools = Editor.require('packages://simple-code/ace/ext-language_tools.js');
  4. Vue.component('widgetBase', {
  5. // 修改组件在 inspector 的显示样式
  6. style: ace.editorCss+`
  7. #editor {
  8. width: 100%;
  9. height: 400px;
  10. }
  11. `,
  12. template: `
  13. <div id="editor"> 测试 </div>
  14. `,
  15. props: {
  16. target: {
  17. twoWay: true,
  18. type: Object,
  19. },
  20. },
  21. $: {
  22. editor: '#editor',
  23. },
  24. // created
  25. created () {
  26. ace.config.set("basePath",Editor.url('packages://simple-code/ace/', 'utf8'))
  27. var editor = ace.edit(this.$editor);
  28. editor.setOptions({
  29. // 默认:false
  30. wrap: true, // 换行
  31. // autoScrollEditorIntoView: false, // 自动滚动编辑器视图
  32. enableLiveAutocompletion: true, // 智能补全
  33. enableSnippets: true, // 启用代码段
  34. enableBasicAutocompletion: true, // 启用基本完成 不推荐使用
  35. });
  36. // 设置主题 cobalt monokai
  37. editor.setTheme("ace/theme/monokai");
  38. // 设置编辑语言
  39. editor.getSession().setMode("ace/mode/javascript");
  40. editor.setReadOnly(false)
  41. editor.getSession().setTabSize(2);
  42. },
  43. });