过滤Vue.js中的数据,但结果始终为空数组

bbuxkriu  于 2023-02-09  发布在  Vue.js
关注(0)|答案(1)|浏览(170)

我想创建一个应用程序,在有数据更新时进行处理并发出声音,系统会公布更新数据的ID,我写了一个程序,每隔1000毫秒检查一次数据库,如果发现5000毫秒内更新过的记录,它就发送信号发出声音,然而,我无法将任何在5000毫秒内更新的记录打印到屏幕上。控制台中没有显示错误信息。
控制台日志(最终数据值);//打印包含多个成员的数组
控制台日志(最新最终数据值);//总是打印空数组
我预期的结果:console.log(latestfinalData.value)不应该是空数组,这样我就可以用它来发出声音。
这是完整的代码

<script setup>
import { ref, onMounted } from 'vue';
import axios from 'axios';

const collection1Data = ref([]);
const collection2Data = ref([]);

const fetchData = async () => {
  const [collection1Response, collection2Response] = await Promise.all([
    axios.get('https://koh-abx.com:50100/onboardshows'),
    axios.get('https://koh-abx.com:50100/onboardlands'),
  ]);
  collection1Data.value = collection1Response.data;
  collection2Data.value = collection2Response.data;
};

const finalData = ref([]);
const latestfinalData = ref([]);

onMounted(async () => {
  await fetchData();
  setInterval(() => {
    fetchData().then(() => {
      finalData.value = [];

      collection1Data.value.forEach(doc1 => {
        const matchingDoc = collection2Data.value.find(doc2 => doc1.idshow === doc2.idshow);
        if (matchingDoc) {
          finalData.value.push({
            idshow: doc1.idshow,
            numbershow: doc1.updatedAt > matchingDoc.updatedAt ? doc1.numbershow : matchingDoc.numbershow,
            ab: doc1.updatedAt > matchingDoc.updatedAt ? doc1.ab : matchingDoc.ab,
            updatedAt: doc1.updatedAt > matchingDoc.updatedAt ? doc1.updatedAt : matchingDoc.updatedAt
          });
        } else {
          finalData.value.push({
            idshow: doc1.idshow,
            numbershow: doc1.numbershow,
            ab: doc1.ab,
            updatedAt: doc1.updatedAt
          });
        }
      });
  
      collection2Data.value.forEach(doc2 => {
        if (!finalData.value.find(doc => doc.idshow === doc2.idshow)) {
          finalData.value.push({
            idshow: doc2.idshow,
            numbershow: doc2.numbershow,
            ab: doc2.ab,
            updatedAt: doc2.updatedAt
          });
        }
      });

      console.log(finalData.value);

      latestfinalData.value = finalData.value.filter(doc => doc.updatedAt >= (Date.now() - 5000));
      console.log(latestfinalData.value);
    });
  }, 1000);
});

</script>
6jjcrrmo

6jjcrrmo1#

尝试使用OP解决方案的以下代码行:

latestfinalData.value = finalData.value.filter(doc => (Date.now() - new Date(doc.updatedAt).getTime()) < 5000);

相关问题