Zoeken op website

reactjs - Hoe geef je een generiek interface door aan een zustand create-aanroep in TypeScript?


Dus ik heb moeite gehad om een antwoord te vinden op de vraag wat de juiste syntaxis is om een generiek interface door te geven bij het aanroepen van een functie die een generiek type accepteert.

Wat ik wil doen is const data=itemStore<T>(state => state.data)

import { create } from "zustand";

interface Item<T> {
  count: number
  data: T
}

const itemStore = create<Item<T>>()((set) => ({
  count: 1,
  data: "generic"
})

Antwoord #1

Teruggekeerd uit de ballingschap, hier is je antwoord mijn vriend:

// store file
type BaseStore<T> = {
  items: T;
};

const INITIAL_ITEMS_DATA: BaseStore<{}>['items'] = {};

const useDataImplementation = create<BaseStore<{}>>((set) => ({
  items: INITIAL_ITEMS_DATA,
}));

export const useStore = useDataImplementation as {
  <T>(): BaseStore<T>;
  <T, U>(selector: (s: BaseStore<T>) => U): U;
};

// Then when you call this thing you need to only pass your interface/type:
interface Item {
  name: string;
  price: string;
  stock: boolean;
}
const store = useStore<Item>();

Hiermee heb je je item netjes en sterk getypt, dus we bevestigen de typen door ze als het ware te laten liegen.

Gerelateerde artikelen