Nextjs問題 - 類型{}上不存在屬性children
P粉658954914
2023-08-16 20:20:47
<p>我正在使用React和Next.js,以下是我的程式碼,它在<code>children</code>屬性上拋出一個錯誤,錯誤訊息為<strong>屬性children在類型{}上不存在</strong></p>
<pre class="brush:php;toolbar:false;">import { NextPage } 從 "next";
import { createContext, useContext, useReducer, Dispatch } from "react";
import { GlobalStatesType } from "../types";
import reducer, { ActionType, initialState } from "../reducers";
export const StateContext = createContext<{
states: GlobalStatesType;
dispatch: Dispatch<ActionType>;
}>({
states: initialState,
dispatch: () => {},
});
export const StateProvider: NextPage = ({ children }) => {
const [states, dispatch] = useReducer(reducer, initialState);
return (
<StateContext.Provider value={{ states, dispatch }}>
{ children }
</StateContext.Provider>
);
};
export const useStatesValue = () => useContext(StateContext);</pre>
<p>如何在我導入的next函數的上下文中寫程式碼? </p>
看起來你正在使用TypeScript和Next.js建立一個上下文提供者元件。你遇到的錯誤"屬性'children'在類型'{}'上不存在",很可能是因為TypeScript在函數元件中無法辨識children屬性。
要解決這個問題,你可以在StateProvider元件中明確定義children屬性的類型。以下是如何做到這一點:
透過定義StateProviderProps類型並使用它來指定StateProvider元件中children屬性的類型,你將不再遇到與children屬性相關的TypeScript錯誤。