Answer the question
In order to leave comments, you need to log in
Why when using composable function inside watch store = undefined?
Hello. There is a component with composition api.
<script setup>
import { computed, ref, watch } from 'vue';
import { useStore } from 'vuex';
import useAvailableChestChampsData from '@/composables/useAvailableChestChampsData';
const championsWithChests = ref({});
const store = useStore();
const allChampionsAvatarsURLS = computed(() => store.getters['imagesStore/allChampionsAvatarsURLS']);
const foundedUser = computed(() => store.getters['currentUserStore/currentUserHeaderData']);
watch(() => foundedUser.value, (newUser) => {
(async () => {
const { availableChestChampsData } = await useAvailableChestChampsData(newUser.id);
championsWithChests.value = availableChestChampsData.value;
})();
});
</script>
import { useStore } from 'vuex';
import { computed, ref } from 'vue';
import api from '@/api/api';
const useAvailableChestChampsData = async (userID) => {
const store = useStore();
console.log(store); // Почему store = undefined???
const championMasteries = ref([]);
try {
const { data } = await api.user.allChampionMasteries(userID);
championMasteries.value = data;
} catch (e) {
console.dir('Не удалось получить информацию о героях пользователя', e);
}
const allChampionsStore = computed(() => store.getters['handbookStore/allChampions']);
const availableChestIdArr = computed(() => championMasteries.value.reduce((acc, champion) => {
if (!champion.chestGranted) acc.push(champion.championId);
return acc;
}, []));
const availableChestChampsData = computed(() => Object.values(allChampionsStore.value)
.filter((champion) => availableChestIdArr.value.includes(Number(champion.key))));
return {
availableChestChampsData,
};
};
export default useAvailableChestChampsData;
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question