小编Hyn*_*ekS的帖子

作为 Typescript 新手，我尝试尽可能准确地输入所有内容，作为学习过程的一部分。

我有一个lqip来自 CMS 的（低质量图像占位符）属性，它应该是 base64 编码的图像。它显然是一个字符串，但将其作为字符串输入感觉有点不精确。

mainImage: Schema.Post["mainImage"] & {\n  //  can I be more precise? It should be always a base64 encoded image, not just a generic string\xe2\x80\xa6\n  // e.g. "data:image/jpeg;base64,/9j/2wBDAAYEB\xe2\x80\xa6"\n  lqip: string\n}\n

Typescript 中有 Base64 编码图像的类型吗？我尝试广泛搜索谷歌，但我只找到了有关atob/btoa转换的主题，而不是类型本身。谢谢！

考虑到我有一个使用一个或多个refsDOM 元素的自定义钩子，我看到了两种不同的方式来编写/使用这样的钩子（而且我知道可能还有更多细微差别 \xe2\x80\x93 例如回调引用）。

选项 1：从自定义挂钩返回ref并在组件中使用它：

const Option1 = () => {\n  const hooksRef = myCustomHookReturninARef()\n  \n  return <div ref={hooksRef}>Using returned ref as prop.</div>\n}\n

选项 2ref ：在组件中创建一个并将其传递给自定义挂钩：

const Option2 = () => {\n  const componentsRef = React.createRef()\n  \n  myCustomHookExpectingRefArgument(componentsRef)\n  \n  return <div ref={componentsRef}>Using created ref as prop..</div>\n}\n

我一直在使用这两个选项，它们似乎都工作得很好。我知道这可能是一个固执己见的问题，但是：

使用第一种方法与第二种方法相比是否有一些明显的缺点？

我正在寻找最“规范”和/或“最新”的方法来将一组默认 HTML 属性作为一组允许的 TypeScript 属性添加到自定义的“增强”HTML 组件中，比如说一个Button.

我发现了两个类型定义。第一个是React.HTMLProps<T>，第二个JSX.IntrinsicElements["T"]。

所以我可以Button通过这种方式增强我的能力：

type Props = {
  children: React.ReactNode
  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void
  type?: "button" | "submit" | "reset"
  className?: string
} & React.HTMLProps<HTMLButtonElement> 

或者像这样：

type Props = {
  children: React.ReactNode
  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void
  type?: "button" | "submit" | "reset"
  className?: string
} & JSX.IntrinsicElements["button"]

我已经尝试了两种方法，它们似乎都工作得很好（没有弯曲的红线）。

问题是：这些类型定义之间是否存在显着差异？我应该使用React.HTMLProps<T>, JSX.IntrinsicElements["T"]，还是这只是个人喜好问题？

谢谢。

稍微相关的问题

我现在正在学习这个Nextjs框架。我想说我已经充分掌握了这些概念，但仍有一些事情我不确定。其中之一是展开运算符[...var]或[[...var]]在动态页面中 | 路由文件名。

例如next/auth 文档中的这一行：

pages/api/auth/[...nextauth].js

是否有一些具体的用例（无法使用 来实现getStaticPaths()），或者它只是我不知道的命名约定？

如何获取包装在类型中的变量的类型Maybe？

在这种情况下，执行Maybe是：

type Maybe<T> = T | null

假设我有一个这样输入的数据：

type MyData = { postTitle: string } & { meta: Maybe<{ tags: Array<El> }> }

我需要提取 El 的类型以便在其他地方使用它。

我是TS菜鸟。我意识到，如果没有包装，很容易获得任何嵌套类型，就像type Easy= Simple['one']['heyAnArrayHere'][number]['propOfArrayElement'] 但一旦 Maybe 以某种方式出现，我就完成了。

我认为我需要一个条件类型，可能类似于 type Expand<T> = T extends Maybe<infer U> ? U : T，但这根​​本不起作用。

任何帮助，将不胜感激！