fix reactivity

This commit is contained in:
Emily
2024-08-07 15:06:06 +02:00
parent 0c8ec73722
commit 4c9efda9ca
13 changed files with 257 additions and 266 deletions

View File

@@ -2,30 +2,30 @@
import { onMounted } from 'vue';
import DateService, { type Slice } from '@services/DateService';
const data = ref<number[]>([]);
const labels = ref<string[]>([]);
const ready = ref<boolean>(false);
// const data = ref<number[]>([]);
// const labels = ref<string[]>([]);
// const ready = ref<boolean>(false);
const props = defineProps<{ slice: Slice, referrer: string }>();
// const props = defineProps<{ slice: Slice, referrer: string }>();
async function loadData() {
const response = await useReferrersTimeline(props.referrer, props.slice);
if (!response) return;
data.value = response.map(e => e.count);
labels.value = response.map(e => DateService.getChartLabelFromISO(e._id, navigator.language, props.slice));
ready.value = true;
}
// async function loadData() {
// const response = await useReferrersTimeline(props.referrer, props.slice);
// if (!response) return;
// data.value = response.map(e => e.count);
// labels.value = response.map(e => DateService.getChartLabelFromISO(e._id, navigator.language, props.slice));
// ready.value = true;
// }
onMounted(async () => {
await loadData();
watch(props, async () => { await loadData(); });
})
// onMounted(async () => {
// await loadData();
// watch(props, async () => { await loadData(); });
// })
</script>
<template>
<div>
<AdvancedBarChart v-if="ready" :data="data" :labels="labels" color="#5680f8">
</AdvancedBarChart>
<!-- <AdvancedBarChart v-if="ready" :data="data" :labels="labels" color="#5680f8">
</AdvancedBarChart> -->
</div>
</template>