材料UI MUIv5文本字段没有 typescript 定义或文档

djp7away  于 2023-02-20  发布在  TypeScript
关注(0)|答案(1)|浏览(116)

Here is the corresponding playground.
TextField上的 typescript 根本不起作用,为什么?

import TextField from "@mui/material/TextField";
import Select from "@mui/material/Select";

export default function App() {
  return (
    <>
      {/* hover 'multiline': does NOT show docs/types ==> bad */}
      <TextField multiline={true} />
      {/* hover 'multiline': does show docs/types ==> good */}
      <Select multiline={true} />
    </>
  );
}

我还引入了一个Select,它突出了预期的行为,我不明白为什么Select(或其他组件)一切正常,而TextField却不行。

kgsdhlau

kgsdhlau1#

Material-UI似乎没有以与Select相同的方式定义TextField的类型定义,这会影响IDE尝试在悬停时提供描述。
您只需要手动为TextField提供一个类型定义,使用与Select类型定义相同的策略,只是使用InputProps
尝试我在working sandbox中验证的以下内容:

系统配置json

{
  "compilerOptions": {
    "lib": ["es6", "dom"],
    "noImplicitAny": true,
    "noImplicitThis": true,
    "strictNullChecks": true,
    "esModuleInterop": true,
    "jsx": "react-jsx",
    "typeRoots": ["node_modules/@types", "src/local-types"],
    "paths": {
      "@mui/material/TextField": ["./src/local-types/mui__material__TextField"]
    }
  },
  "exclude": ["node_modules", "src/local-types/**"]
}

src/局部类型/mui__material__文本字段(两个双下划线)

import { InputProps } from "@mui/material";

declare const TextField: ((props: InputProps) => JSX.Element) & {
  muiName: string;
};

export default TextField;

相关问题