电量显示走接口请求

src/components/BattleFooter.vue

@@ -15,10 +15,6 @@ defineProps({
     type: Number,
     default: 0,
   },
-  power: {
-    type: Number,
-    default: 0,
-  },
   goldenRound: {
     type: Number,
     default: 0,
@@ -36,7 +32,7 @@ defineProps({
           transform: 'scale(0.8) translateX(10px)',
         }"
       >
-        <BowPower :power="power" />
+        <BowPower />
       </view>
     </view>
     <view>

src/components/BowPower.vue

@@ -1,9 +1,19 @@
 <script setup>
-defineProps({
-  power: {
-    type: Number,
-    default: 0,
-  },
+import { ref, onMounted, onBeforeUnmount } from "vue";
+import { getDeviceBatteryAPI } from "@/apis";
+
+const power = ref(0);
+const timer = ref(null);
+
+onMounted(async () => {
+  timer.value = setInterval(async () => {
+    const data = await getDeviceBatteryAPI();
+    power.value = data.battery;
+  }, 1000 * 10);
+});
+
+onBeforeUnmount(() => {
+  clearInterval(timer.value);
 });
 </script>
 

src/components/BowTarget.vue

@@ -21,10 +21,6 @@ const props = defineProps({
     type: String,
     default: "",
   },
-  power: {
-    type: Number,
-    default: 0,
-  },
   scores: {
     type: Array,
     default: () => [],
@@ -118,7 +114,7 @@ onMounted(() => {
         "/" +
         totalRound
       }}</text>
-      <BowPower :power="power" />
+      <BowPower />
     </view>
     <view class="target">
       <view v-if="stop" class="stop-sign">中场休息</view>

src/components/TestDistance.vue

@@ -22,7 +22,6 @@ const props = defineProps({
   },
 });
 const arrow = ref({});
-const power = ref(0);
 const distance = ref(0);
 const debugInfo = ref("");
 const showsimul = ref(false);
@@ -49,7 +48,6 @@ async function onReceiveMessage(messages = []) {
   messages.forEach((msg) => {
     if (msg.constructor === MESSAGETYPES.ShootSyncMeArrowID) {
       arrow.value = msg.target;
-      power.value = msg.target.battery;
       distance.value = Number((msg.target.dst / 100).toFixed(2));
       debugInfo.value = msg.target;
       audioManager.play("距离合格");
@@ -120,7 +118,7 @@ onBeforeUnmount(() => {
       </view>
       <view class="user-row">
         <Avatar :src="user.avatar" :size="35" />
-        <BowPower :power="power" />
+        <BowPower />
       </view>
     </view>
     <view v-if="isBattle" class="ready-timer">