[英]'Router' cannot be used as a JSX component. It was working fine until I added the component Msal componant in index.tsx and PageLayout in app.tsx
應用程序.tsx:
'導入語句`
export default function App() {
const { loading, theme, themeString, teamsfx } = useTeamsFx();
return (
<TeamsFxContext.Provider value={{theme, themeString, teamsfx}}>
<PageLayout>
<AuthenticatedTemplate>
<ProfileContent />
</AuthenticatedTemplate>
<UnauthenticatedTemplate>
<p>You are not signed in! Please sign in.</p>
</UnauthenticatedTemplate>
</PageLayout>
<Provider theme={theme || teamsTheme} styles={{ backgroundColor: "#eeeeee" }}>
<Router> `Error here`
<Route exact path="/"> `Error here`
<Redirect to="/tab" />
</Route>
{loading ? (
<Loader style={{ margin: 100 }} />
) : (
<>
<Route exact path="/privacy" component={Privacy} /> `Error here`
<Route exact path="/termsofuse" component={TermsOfUse} /> `Error here`
<Route exact path="/tab" component={Tab} /> `Error here`
<Route exact path="/config" component={TabConfig} /> `Error here`
</>
)}
</Router>
</Provider>
</TeamsFxContext.Provider>
);
}
索引.tsx:
'導入語句`
const msalInstance = new PublicClientApplication(msalConfig);
// ReactDOM.render(<App />,document.getElementById("root"));
ReactDOM.render(
<React.StrictMode>
<MsalProvider instance={msalInstance}>
<App />
</MsalProvider>
</React.StrictMode>,
document.getElementById("root")
);
錯誤消息:(別名)類重定向導入重定向“重定向”不能用作 JSX 組件。 它的實例類型“重定向”不是有效的 JSX 元素。 'render()' 返回的類型在這些類型之間不兼容。 類型 'React.ReactNode' 不可分配給類型 'import("C:/Users/t-harshsh/source/vscode/Refer-Profile-Services/Teams-Referral-Services/node_modules/@types/react/index") .ReactNode'.ts(2786)
由於主要依賴項中存在的 react 版本與安裝 @azure/msal-react 庫時安裝的版本不匹配而出現錯誤,請嘗試降級 react 版本以匹配庫的版本。
運行: npm install react@17.0.2
或者庫的 package.json 中提到的版本。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.