我如何将泛型从函数传递给useState

时间:2019-10-02 09:00:50

标签: reactjs typescript

我需要将我从函数获得的泛型传递给useState,因为它是状态的一部分。我该怎么办?

示例代码:

import React, { useState }  from "react";

const DialogContext = React.createContext<TContext>({});

type TStatus = 'close' | 'success' | 'cancel'

type TReturnContext<V> = {
  status: TStatus,
  values: V
};

type TContext = {
  open?: TOpenCallback
};

type TInstances = {
  instanceName: string
};


type TProps = {
  Layout: React.ElementType
  config: {
    [instanceName: string]: React.FC<null>
  }
};

type TOpenCallback = <T, V>(instanceName: string, params: T) => Promise<Readonly<TReturnContext<V>>>;

export const Provider: React.FC<TProps> = ({ children, Layout, config }) => {
  const [instances, setInstances] = useState<Array<TInstances>>([]);

  const open: TOpenCallback = (instanceName, params) =>
    new Promise(() => {
      setInstances(prevInstances => [
        ...prevInstances,
        { instanceName, params }
      ]);
    });

  const context = {
    open
  };


  const component = instances.map(({ instanceName, params }) => (
    <Layout
      key={instanceName}
      instanceName={instanceName}
      component={config[instanceName]}
      // cancel={cancel}
      // success={success}
      // close={close}
      params={params}
    />
  ));

  return (
    <DialogContext.Provider value={context}>
      <>
        {children}
        {component}
      </>
    </DialogContext.Provider>
  );
};

error

类型“ TInstances”没有属性“ params”,也没有字符串索引签名

这不是完整的示例,但是当我使用开放函数时,我将了解params类型,如何将其传递给useState泛型?

0 个答案:

没有答案