🧐[问题]关于ThemeProvider ts类型问题
hef98 opened this issue · comments
🧐 问题描述
💻 示例代码
ThemeProvider: <T = any, S = any>(props: import("..").ThemeProviderProps<T, S>) => import("react").ReactNode
但是它实际上是一个Object,因为我将它当成一个函数调用时 会报错ThemeProvider is not a function
🚑 其他信息
有示例代码么
有示例代码么
injectGlobal: {
(template: TemplateStringsArray, ...args: import("@emotion/serialize").CSSInterpolation[]): void;
(...args: import("@emotion/serialize").CSSInterpolation[]): void;
}, styleManager: import("../core").Emotion, ThemeProvider: <T = any, S = any>(props: import("..").ThemeProviderProps<T, S>) => import("react").ReactNode, StyleProvider: import("react").FC<import("../factories/createStyleProvider").StyleProviderProps>, useTheme: () => import("..").Theme;
import { useState } from "react";
import { ThemeProvider } from "antd-style"
import reactLogo from "./assets/react.svg";
import "./App.css";
function App() {
const [count, setCount] = useState(0);
ThemeProvider({
themeMode:"auto",
children:["123"]
})
return (
<div className="App">
</div>
);
}
export default App
```;
![image](https://github.com/ant-design/antd-style/assets/103022158/44f9393f-e922-4ffa-8058-f0d11380728a)
你的用法明显是错的…
import { useState } from "react";
import { ThemeProvider } from "antd-style"
import reactLogo from "./assets/react.svg";
import "./App.css";
function App() {
const [count, setCount] = useState(0);
return (
<ThemeProvider themeMode={'auto'} >
<div className="App">
</div>
</ThemeProvider>
);
}
export default App
你的用法明显是错的…
import { useState } from "react"; import { ThemeProvider } from "antd-style" import reactLogo from "./assets/react.svg"; import "./App.css"; function App() { const [count, setCount] = useState(0); return ( <ThemeProvider themeMode={'auto'} > <div className="App"> </div> </ThemeProvider> ); } export default App
这样使用在vscode 会有一个错误
“ThemeProvider”不能用作 JSX 组件。
其返回类型 "ReactNode" 不是有效的 JSX 元素。
不能将类型“undefined”分配给类型“Element | null”。ts(2786)
因为 ReactNode类型 有可能是undefined
你的用法明显是错的…
import { useState } from "react"; import { ThemeProvider } from "antd-style" import reactLogo from "./assets/react.svg"; import "./App.css"; function App() { const [count, setCount] = useState(0); return ( <ThemeProvider themeMode={'auto'} > <div className="App"> </div> </ThemeProvider> ); } export default App这样使用在vscode 会有一个错误 “ThemeProvider”不能用作 JSX 组件。 其返回类型 "ReactNode" 不是有效的 JSX 元素。 不能将类型“undefined”分配给类型“Element | null”。ts(2786) 因为 ReactNode类型 有可能是undefined
这个应该是你的 react 版本不对。升级到最新的 @types/react 应该就好了: #63
你的最明显的是错误的...
import { useState } from "react"; import { ThemeProvider } from "antd-style" import reactLogo from "./assets/react.svg"; import "./App.css"; function App() { const [count, setCount] = useState(0); return ( <ThemeProvider themeMode={'auto'} > <div className="App"> </div> </ThemeProvider> ); } export default App这样在 vscode 中使用会出现一个错误“ThemeProvider”无法初始化 JSX 组件。其返回类型“ReactNode”不是有效的 JSX 元素。不能将类型“undefined”分配给类型“Element | ”。null”。ts(2786) 因为 ReactNode 类型可能是未定义的
这应该是你的react版本不对。升级到最新的@types/react应该就可以了:#63
找到问题了 因为我的typescript版本是4 在@types/react中 package.json
"typesVersions": {
"<=5.0": {
"*": [
"ts5.0/*"
]
}
},
这导致了FunctionComponent类型声明有些许差异
非常感谢您的耐心解答!