簡體   English   中英

'Router' 不能用作 JSX 組件。 在我在 index.tsx 中添加組件 Msal 組件和在 app.tsx 中添加 PageLayout 之前,它工作正常

[英]'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.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM