Home > OS >  Type error when adding providesTags in RTK Query
Type error when adding providesTags in RTK Query

Time:02-16

I'm trying to set up cache invalidation for my project with RTK Query, but I get a type error when following the official documentation. The goal is to invalidate individual items in the fetched list of resources, but I get stuck just trying to provide one general tag:

import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';

export const remoteScriptsApi = createApi({
    baseQuery: fetchBaseQuery({
        baseUrl: '/api', prepareHeaders: (headers) => {
            headers.set('Accept', 'plain/text, application/json');
            return headers;
        }
    }),
    endpoints: (builder) => ({
        getScenes: builder.query<number[], void>({
            query: () => ({ url: '/scenes' }),
            providesTags: ['Scenes']
        }),
    })
})

The ['Scenes'] get underlined displaying the following error message:

Type 'string' is not assignable to type 'FullTagDescription<never>'.ts(2322)

I'm quite new to TypeScript, but I've still tried to dig in the type files for RTK Query to find out where and why "never" is expected. No luck though.

Let me know if more background on my project and/or code is needed! Thanks!

CodePudding user response:

I'm not familiar enough with API in RTK, but I played a bit with typescript there and found out that if you declare tagTypes in your createApi object it solves problem:

export const remoteScriptsApi = createApi({
    baseQuery: fetchBaseQuery({
        baseUrl: '/api', prepareHeaders: (headers) => {
            headers.set('Accept', 'plain/text, application/json');
            return headers;
        }
    }),
    tagTypes: ['Scenes'], // <---- declare your tagTypes before you use them
    endpoints: (builder) => ({
        getScenes: builder.query<number[], void>({
            query: () => ({ url: '/scenes' }),
            providesTags: ['Scenes']
        }), ...
  • Related