使用 TypeScript，带有 React 的 JSS 会为某些 css 属性抛出 `type is unassignable`

Question

我是 TypeScript 的新手。我有一个通过create-react-appTypeScript创建的项目。我也在那里使用 JSS。在某些时候，我发现某些 CSS 属性会引发错误。

例如，这里有pointerEvents和position。每当我使用它们时，都会出现错误。

(42,28): Argument of type '{ placeholder: { pointerEvents: string; }; wrapper: { '& select': { position: string; }; }; }' is not assignable to parameter of type 'Record<"wrapper" | "placeholder", CSSProperties> | StyleCreator<"wrapper" | "placeholder", {}>'.
Type '{ placeholder: { pointerEvents: string; }; wrapper: { '& select': { position: string; }; }; }' is not assignable to type 'StyleCreator<"wrapper" | "placeholder", {}>'.
Type '{ placeholder: { pointerEvents: string; }; wrapper: { '& select': { position: string; }; }; }' provides no match for the signature '(theme: {}): Record<"wrapper" | "placeholder", CSSProperties>'.

更换pointerEvents用'pointer-events'的伎俩。但是没有办法用position属性来做到这一点。

所以我实际上必须要么解决这个问题，要么找到一个解决方法。

Answer 1

因此，我发现最简单的方法是将包含样式的文件作为tsx文件并分配如下属性：

classname: {
  position: 'absolute' as 'absolute',
}