0

我正在尝试测试我的 ionic-vue 代码的一小部分，它给了我这个错误：在 Vue 上下文中找不到查询客户端，使用“useQueryProvider”在根组件中设置一个。

应用程序组件已经像这样包装在 useQueryProvider 中：

useQueryProvider({
      defaultOptions: {
        queries: {
          refetchOnWindowFocus: false,
          retry: (count, error: any) => {
            return (error as HTTPError).response.status !== 401 && count < 3;
          },
        },
      },
    });

这是我要测试的部分：

<template>
  <ion-page>
    <ion-header>
      <ion-toolbar>
        <ion-title>{{ t('tabs.Bookings') }}</ion-title>
      </ion-toolbar>
    </ion-header>
    <ion-content :fullscreen="true">
      <ion-header collapse="condense">
        <ion-toolbar>
          <ion-title class="bold-text" size="large">Meine Buchungen</ion-title>
        </ion-toolbar>
      </ion-header>

这是我为测试该部分而编写的代码：


import Index from '@/views/bookings/index.vue';
import { shallowMount, mount } from '@vue/test-utils';
import { createBookingMock } from '@tests/unit/mocks/booking.mock'; 
import App from '@/App.vue'



const wrapper = mount(Index)
expect(wrapper.exists()).toBe(true)
expect(wrapper.find('.bold-text').exists()).toEqual('Meine Buchungen')


describe('Index', () => 
      const wrapper = mount(Index, {
       
 expect(wrapper.find('.bold-text').exists()).toEqual('Meine Buchungen')
      })

这是我得到的错误：在 Vue 上下文中找不到 queryClient，使用“useQueryProvider”在根组件中设置一个。

错误与这部分有关：

import { BookingApi } from '@/api/booking.api';
import { PerformBooking, BookingInfo} from '@/model/booking.model';
import { container, singleton } from 'tsyringe';
import { useQuery } from 'vue-query';

@singleton()
export class BookingService {
  static getInstance() {
    return container.resolve(BookingService);
  }
 ---> private query = useQuery('bookings', () => this.bookingApi.getBookingsofUser());
  data = this.query.data;
  isFetching = this.query.isFetching;
  isError = this.query.isError;
4

0 回答 0