MonocaEditor采用异步加载,优化整体加载速度

This commit is contained in:
fofolee 2024-01-23 00:03:34 +08:00
parent 325c6c746a
commit 632adf11e1
2 changed files with 33 additions and 12 deletions

View File

@ -211,7 +211,8 @@
class="absolute-bottom"
:placeholder="true"
ref="editor"
@typing="(val) => (quickcommandInfo.cmd = val)"
@loaded="monacoInit"
@typing="(val) => monacoTyping(val)"
@keyStroke="monacoKeyStroke"
:style="{
top: languageBarHeight + 'px',
@ -225,11 +226,15 @@
</template>
<script>
import MonacoEditor from "components/MonacoEditor";
import { defineAsyncComponent } from "vue";
import CommandSideBar from "components/CommandSideBar";
import CommandRunResult from "components/CommandRunResult";
import QuickAction from "components/popup/QuickAction";
import KeyRecorder from "components/popup/KeyRecorder";
// Monaco
const MonacoEditor = defineAsyncComponent(() =>
import("components/MonacoEditor")
);
export default {
components: {
@ -270,8 +275,11 @@ export default {
props: {
action: Object,
},
created() {
this.commandInit();
},
mounted() {
this.init();
this.sidebarInit();
},
computed: {
configurationPage() {
@ -288,23 +296,29 @@ export default {
},
},
methods: {
init() {
//
commandInit() {
let quickCommandInfo =
this.action.type === "run"
? this.$root.utools.getDB("cfg_codeHistory")
: this.action.data;
quickCommandInfo?.program &&
Object.assign(this.quickcommandInfo, _.cloneDeep(quickCommandInfo));
// monaco
this.$refs.editor.setEditorValue(this.quickcommandInfo.cmd);
this.setLanguage(this.quickcommandInfo.program);
this.$refs.editor.setCursorPosition(this.quickcommandInfo.cursorPosition);
//
if (this.quickcommandInfo.tags?.includes("默认") && !utools.isDev()) {
this.canCommandSave = false;
}
},
//
sidebarInit() {
this.$refs.sidebar?.init();
},
// MonacoMonaco
monacoInit() {
this.$refs.editor.setEditorValue(this.quickcommandInfo.cmd);
this.setLanguage(this.quickcommandInfo.program);
this.$refs.editor.setCursorPosition(this.quickcommandInfo.cursorPosition);
},
programChanged(value) {
this.setLanguage(value);
if (value === "custom") this.$refs.settings.show();
@ -373,6 +387,9 @@ export default {
command.cursorPosition = this.$refs.editor.getCursorPosition();
this.$root.utools.putDB(command, "cfg_codeHistory");
},
monacoTyping(val) {
this.quickcommandInfo.cmd = val;
},
monacoKeyStroke(event, data) {
switch (event) {
case "run":

View File

@ -46,6 +46,7 @@ export default {
},
mounted() {
this.initEditor();
this.$emit("loaded");
},
props: {
placeholder: Boolean,
@ -213,10 +214,13 @@ export default {
}
);
// alt + z
this.rawEditor().addCommand(monaco.KeyMod.Alt | monaco.KeyCode.KeyZ, () => {
that.wordWrap = that.wordWrap === "off" ? "on" : "off";
that.rawEditor.updateOptions({ wordWrap: that.wordWrap });
});
this.rawEditor().addCommand(
monaco.KeyMod.Alt | monaco.KeyCode.KeyZ,
() => {
that.wordWrap = that.wordWrap === "off" ? "on" : "off";
that.rawEditor.updateOptions({ wordWrap: that.wordWrap });
}
);
// ctrl + s
this.rawEditor().addCommand(
monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyS,