如何使用Vue 3组件中的Vuex4状态数据作为另一个派单的有效负载？

// store.js
import { createStore } from 'vuex';

export default createStore({
  state() {
    return {
      selectedOrder: null,
      orders: [
        // ...订单数据
      ]
    };
  },
  mutations: {
    SET_SELECTED_ORDER(state, order) {
      state.selectedOrder = order;
    }
  },
  actions: {
    selectOrder({ commit }, order) {
      commit('SET_SELECTED_ORDER', order);
    }
  }
});

<!-- OrderList.vue -->
<template>
  <div>
    <ul>
      <li v-for="order in orders" :key="order.id" @click="selectOrder(order)">
        {{ order.name }}
      </li>
    </ul>
  </div>
</template>

<script>
import { mapActions } from 'vuex';

export default {
  computed: {
    orders() {
      return this.$store.state.orders;
    }
  },
  methods: {
    ...mapActions(['selectOrder'])
  }
};
</script>

<!-- OrderDetail.vue -->
<template>
  <div v-if="selectedOrder">
    <h1>{{ selectedOrder.name }}</h1>
    <p>{{ selectedOrder.description }}</p>
  </div>
</template>

<script>
import { mapState } from 'vuex';

export default {
  computed: {
    ...mapState(['selectedOrder'])
  }
};
</script>