合并provide/inject

src/App.vue

@@ -46,8 +46,6 @@ function send_request() { // 将输入的代码/测试用例发送给后端
       });
   }
 }
-provide('input', { code_input, stdin_input, send_request })
-
 const data = ref({}) // 后端返回的数据
 function parse_result() { // 解析后端返回的结果
   remove_back_slash_r()
@@ -108,8 +106,6 @@ const next_line = computed(() => { // 播放的下一步代码对应的行数
   } catch (e) { }
 })
 const try_failed = ref(false) // 尝试运行代码失败
-provide('data', { data, success, exception_msg, get_step, current_line, next_line, try_failed })
-
 const total_steps = ref(1) // 总步骤数
 const current_step = ref(1) // 当前步骤
 const highlight_steps = ref([]) // 高亮的步骤
@@ -144,14 +140,29 @@ function click_line(clicked) { // 点击某一行
     enable_line(clicked)
   }
 }
-provide('step', { total_steps, current_step, highlight_steps, click_step, highlight_lines, click_line })
-
 const edit_mode = ref(true) // 编辑模式，对应的是播放模式
-provide('edit_mode', edit_mode)
-
 const loading = ref(false) // 发送请求等待后端返回的状态
-provide('loading', loading)
 
+provide('app', {
+  loading,
+  code_input,
+  stdin_input,
+  send_request,
+  data,
+  success,
+  exception_msg,
+  get_step,
+  current_line,
+  next_line,
+  try_failed,
+  total_steps,
+  current_step,
+  highlight_steps,
+  click_step,
+  highlight_lines,
+  click_line,
+  edit_mode
+})
 </script>
 
 <template>

src/components/CodeEditor.vue

@@ -2,7 +2,7 @@
 
 import { inject } from 'vue';
 
-const { code_input } = inject('input')
+const { code_input } = inject('app')
 
 const placeholder = '将你的代码粘贴到这里'
 

src/components/CodeViewer.vue

@@ -3,7 +3,7 @@
 import { computed, inject } from 'vue';
 import LineUnit from './LineUnit.vue';
 
-const { data } = inject('data');
+const { data } = inject('app');
 const code = computed(() => {
   return data.value['code'];
 })

src/components/ControlPanel.vue

@@ -6,9 +6,8 @@ import RunButton from './buttons/RunButton.vue';
 import PrevButton from './buttons/PrevButton.vue';
 import NextButton from './buttons/NextButton.vue';
 
-const { total_steps, current_step } = inject('step')
 
-const edit_mode = inject('edit_mode')
+const { total_steps, edit_mode } = inject('app')
 
 const css_grid_template_columns = computed(() => {
   return `repeat(${total_steps.value}, 1fr)`;

src/components/InfoView.vue

@@ -2,7 +2,7 @@
 import { inject } from 'vue';
 
 
-const { exception_msg, try_failed } = inject('data')
+const { exception_msg, try_failed } = inject('app')
 
 </script>
 

src/components/LineUnit.vue

@@ -3,11 +3,8 @@ import { computed, inject, ref } from 'vue';
 
 const props = defineProps(['line', 'code'])
 
-const { current_line, next_line } = inject('data')
 
-const { click_line, highlight_lines } = inject('step')
-
-const { success } = inject('data')
+const { current_line, next_line, click_line, highlight_lines } = inject('app')
 
 const line = computed(() => {
   return props.line

src/components/StackView.vue

@@ -2,9 +2,8 @@
 import { computed, inject, provide, watch, ref } from 'vue';
 import VarUnit from './VarUnit.vue';
 
-const { get_step } = inject('data')
 
-const { current_step } = inject('step')
+const { get_step, current_step } = inject('app')
 
 const current_stack = computed(() => {
   return get_step(current_step.value + 1)
@@ -79,7 +78,7 @@ function check_changed(value) {
   }
   return 'x'
 }
-provide('check_changed', { check_changed })
+
 
 const has_globals = computed(() => {
   try {
@@ -109,7 +108,7 @@ const highlight_addresses = ref({})
 watch(current_step, () => {
   highlight_addresses.value = {}
 })
-provide('highlight_address', { highlight_addresses })
+provide('stack_view',{highlight_addresses,check_changed})
 
 
 function click() {

src/components/StdinEditor.vue

@@ -2,12 +2,8 @@
 
 import { computed, inject } from 'vue';
 
-const { stdin_input } = inject('input')
+const { stdin_input, edit_mode } = inject('app')
 
-const edit_mode = inject('edit_mode')
-const readonly = computed(() => {
-  return !(edit_mode.value)
-})
 
 const placeholder = '将你的测试用例粘贴到这里\n(如果有的话)'
 

src/components/StepUnit.vue

@@ -6,7 +6,7 @@ const this_step = computed(() => {
   return props.step
 })
 
-const { current_step, click_step, highlight_steps } = inject('step')
+const { current_step, click_step, highlight_steps } = inject('app')
 const finished = computed(() => {
   return this_step.value <= current_step.value
 })

src/components/VarUnit.vue

 <script setup>
 import { computed, inject, ref, watch } from 'vue';
 
+const {  current_step } = inject('app')
+const { check_changed, highlight_addresses } = inject('stack_view')
 
 const props = defineProps(['var_name', 'var_content', 'changed'])
 const var_name = computed(() => {
@@ -79,9 +81,8 @@ const is_pointer = computed(() => {
   }
   return false
 })
-const { check_changed } = inject('check_changed')
 
-const { highlight_addresses, highlight_address, unhighlight_address } = inject('highlight_address')
+
 
 const pointer_color = ref(-1)
 const css_pointer_color = computed(() => {
@@ -139,7 +140,7 @@ function highlight_pointer() {
   }
 }
 
-const { current_step } = inject('step')
+
 
 watch(current_step, () => {
   pointer_color.value = -1

src/components/buttons/EditButton.vue

 <script setup>
 import { inject } from 'vue';
 
-const edit_mode = inject('edit_mode')
-const { try_failed } = inject('data')
+
+const { edit_mode, try_failed } = inject('app')
 function click() {
   edit_mode.value = true
   try_failed.value = false

src/components/buttons/NextButton.vue

 <script setup>
 import { inject } from 'vue';
 
-const { current_step, total_steps } = inject('step')
+const { current_step, total_steps } = inject('app')
 
 function click() {
   if (current_step.value < total_steps.value) {

src/components/buttons/PrevButton.vue

@@ -2,7 +2,7 @@
 
 import { inject } from 'vue';
 
-const { current_step } = inject('step')
+const { current_step } = inject('app')
 
 function click() {
   if (current_step.value > 1) {

src/components/buttons/RunButton.vue

@@ -2,12 +2,8 @@
 import { computed, inject } from 'vue';
 import Loading from './Loading.vue'
 
-const edit_mode = inject('edit_mode')
 
-const loading = inject('loading')
-
-const { send_request, code_input } = inject('input')
-const { try_failed } = inject('data')
+const { send_request, code_input, try_failed, loading } = inject('app')
 
 const code_not_null = computed(() => {
   return code_input.value.length > 0