vue-use-query/esm/vue/useBaseQuery.js

vue use query

import { onMounted, onUnmounted, reactive, watch } from 'vue';
import { useQueryClient } from './QueryClientProvider';
function genArr(data) {
    return Array.isArray(data) ? data : data == undefined ? [] : [data];
}
export function useBaseQuery(options, Observer) {
    var queryClient = useQueryClient();
    var defaultedOptions = queryClient.defaultQueryObserverOptions(options);
    var observer = new Observer(queryClient, defaultedOptions);
    var result = reactive(observer.getCurrentResult());
    // 监听依赖项的变化
    watch(function () { return options.queryKey; }, function () {
        observer.setOptions(options); // 主要里面存在一个updateQuery方法
        observer.updateResult();
    }, {
        deep: true,
    });
    // 订阅数据的变化
    var unsubscribe;
    onMounted(function () {
        // Update result to make sure we did not miss any query updates
        // between creating the observer and subscribing to it.
        observer.updateResult();
        unsubscribe = observer.subscribe(function (res) {
            Object.assign(result, res);
        });
    });
    onUnmounted(function () {
        unsubscribe === null || unsubscribe === void 0 ? void 0 : unsubscribe();
    });
    return result;
}