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

vue use query

import { onMounted, onUnmounted, reactive, watchEffect } from 'vue';
import { QueriesObserver } from '../core/queriesObserver';
import { useQueryClient } from './QueryClientProvider';
/**
 * 批量使用useQuery
 */
export function useQueries(queries) {
    var queryClient = useQueryClient();
    var defaultedQueries = queries.map(function (options) {
        var defaultedOptions = queryClient.defaultQueryObserverOptions(options);
        // Make sure the results are already in fetching state before subscribing or updating options
        defaultedOptions.optimisticResults = true;
        return defaultedOptions;
    });
    var observer = new QueriesObserver(queryClient, defaultedQueries);
    var result = reactive(observer.getOptimisticResult(defaultedQueries));
    // 订阅数据的变化
    var unsubscribe;
    onMounted(function () {
        unsubscribe = observer.subscribe(function (res) {
            Object.assign(result, res);
        });
    });
    onUnmounted(function () {
        unsubscribe === null || unsubscribe === void 0 ? void 0 : unsubscribe();
    });
    watchEffect(function () {
        // Do not notify on updates because of changes in the options because
        // these changes should already be reflected in the optimistic result.
        observer.setQueries(defaultedQueries, { listeners: false });
    });
    return result;
}