第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會(huì)有你想問的

React 笑話 - 你不應(yīng)該在 <Router> 之外使用 <Link>

React 笑話 - 你不應(yīng)該在 <Router> 之外使用 <Link>

PIPIONE 2023-06-15 09:46:18
我有一個(gè)像這樣的超級簡單的反應(yīng)應(yīng)用程序。索引.tsx應(yīng)用程序.tsx主要.tsx主頁.tsx索引.tsximport React from 'react';import ReactDOM from 'react-dom';import './index.css';import App from './App';import { BrowserRouter as Router } from "react-router-dom";import { ApolloProvider } from "react-apollo";import client from "./utils/client";ReactDOM.render(  <Router>    <ApolloProvider client={client}>      <App />    </ApolloProvider>  </Router>,  document.getElementById('root'));應(yīng)用程序.tsximport React from 'react';import Main from "./Main";function App() {  return (    <Main />  );}export default App;主要.tsximport React from 'react';import { Switch, Route, Link } from "react-router-dom";import Home from "./Home";const Main:React.FC = () => {    return (        <div>            <Switch>                <Route exact path='/' component={Home} />            </Switch>        </div>    );};export default Main;主頁.tsximport React, {useContext} from 'react';import { Link } from "react-router-dom";const Home:React.FC = () => {    return (        <div>            <h1>Home</h1>            <Link to='http://google.com'> Google</Link>        </div>    );};export default Home;    我有一個(gè)帶有虛擬測試的 App.test.tsx 來運(yùn)行它。import React from 'react';import { render, screen } from '@testing-library/react';import App from './App';test('renders learn react link', () => {  render(<App />);  expect(true).toBeTruthy});如果我用yarn test我得到一個(gè)錯(cuò)誤:不變失?。耗悴粦?yīng)該<Link>在 a 之外使用<Router>我擁有的鏈接被Home.tsc包圍<Router>在index.tsx我在這里做點(diǎn)事。該應(yīng)用程序運(yùn)行沒有任何錯(cuò)誤。此錯(cuò)誤僅在我運(yùn)行測試時(shí)出現(xiàn)
查看完整描述

1 回答

?
揚(yáng)帆大魚

TA貢獻(xiàn)1799條經(jīng)驗(yàn) 獲得超9個(gè)贊

下面有兩種解決方案,第一種是將<Router>組件添加到您的測試用例中。第二個(gè)選項(xiàng)是從 切換<Link>到一個(gè)簡單的錨標(biāo)記。

選項(xiàng)1:

<Router>也可以將組件添加到您的測試中,這樣它就不會(huì)丟失:

test('renders learn react link', () => {

? render(<Router>

? ? <App />

? </Router>);


? expect(true).toBeTruthy

});

選項(xiàng) 2:


您也可以從組件更改<Link>為簡單的錨標(biāo)記,因?yàn)樗鼤?huì)根據(jù)您的代碼創(chuàng)建相同的最終結(jié)果:


<Link to='http://google.com'> Google</Link>

組件中的以下內(nèi)容<Home>:


<a >Google</a>

然后最后你可以保留你原來的測試用例。


查看完整回答
反對 回復(fù) 2023-06-15
  • 1 回答
  • 0 關(guān)注
  • 177 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)