keep code in localStorage

This commit is contained in:
2022-11-17 03:03:24 +01:00
parent 1472405c01
commit d77b443059

View File

@@ -13,14 +13,19 @@ import SplitterPanel from 'primevue/splitterpanel';
import { defineComponent, shallowRef } from 'vue'; import { defineComponent, shallowRef } from 'vue';
const STORAGE_KEY_CODE = 'code';
export default defineComponent({ export default defineComponent({
components: { components: {
Splitter, SplitterPanel, Splitter, SplitterPanel,
Result, Code, Result, Code,
}, },
data() { data() {
const lsCode = localStorage.getItem(STORAGE_KEY_CODE);
const code = { value: lsCode ? lsCode : WELCOME_CODE };
return { return {
code: { value: WELCOME_CODE }, code,
worker: null, worker: null,
result: '', result: '',
} }
@@ -29,6 +34,13 @@ export default defineComponent({
this.run(this.code.value); this.run(this.code.value);
}, },
methods: { methods: {
save(code) {
localStorage.setItem(STORAGE_KEY_CODE, code);
},
change(code) {
this.run(code);
setTimeout(() => this.save(code), 1);
},
run(code) { run(code) {
this.terminate(); this.terminate();
this.result = ''; this.result = '';
@@ -53,8 +65,7 @@ export default defineComponent({
} }
}, },
} }
}) });
</script> </script>
<style scoped> <style scoped>
@@ -77,7 +88,7 @@ main {
<main> <main>
<Splitter style="height: 100%" :step="50" :gutterSize="8" layout="horizontal"> <Splitter style="height: 100%" :step="50" :gutterSize="8" layout="horizontal">
<SplitterPanel class="left-pane"> <SplitterPanel class="left-pane">
<Code :code="code" @change="run($event)"/> <Code :code="code" @change="change($event)"/>
</SplitterPanel> </SplitterPanel>
<SplitterPanel class="right-pane"> <SplitterPanel class="right-pane">
<Result :data="result"/> <Result :data="result"/>