Tìm kiếm trang web

typescript - Sử dụng generics với phương thức create của zustand


Tôi có một cửa hàng zustand chứa các mục loại GridRow<T>. Điều này đại diện cho các hàng được chọn trong một lưới chính, vì vậy nó sử dụng generics để đại diện cho dữ liệu cụ thể được sử dụng trong lưới.

Tôi không chắc cách truyền kiểu tổng quát (generic) cho phương thức create của cửa hàng. Tôi không thể bao nó trong một hàm khác vì điều đó sẽ tạo ra một cửa hàng mới mỗi lần.

interface MainGridState<T> {
  selectedRows: Array<GridRow<T>>
}

const initialState = {
  selectedRows: []
}

// T is undefined here, as I have no way to declare it
const useMainGridStore = create<MainGridState<T>>()(set => ({
  ...initialState,
}))

export const useMainGridSelectedRows = <T>(): Array<GridRow<T>> =>
  useMainGridStore<T>(state => state.selectedRows)

Câu trả lời #1

Thử cái này:

interface MainGridState<T> {
  selectedRows: Array<GridRow<T>>
}

export type UseDataReturn<T> = {
  data: MainGridState<T>;
};

const initialState: UseDataReturn<{}>["data"] = {
  selectedRows: []
};

export const useMainGridSelectedRows = create<UseDataReturn<{}>>((set) => ({
  data: initialState,
}));

export const useMainGridStore = useMainGridSelectedRows as {
  <T>(): UseDataReturn<T>;
  <T, U>(selector: (s: UseDataReturn<T>) => U): U;
};

// then use it
function Test() {

  // Use desired type instead of 'string'

  const dataExample = useMainGridStore<GridRow<string>[]>().data;

  const stateExample = useMainGridStore<string, GridRow<string>[]>(state => state.data.selectedRows)
}

Bài viết liên quan