Реагирует js при изменении пути с <Link>это не так, потому что не заканчивается sh загрузка страницы

Question

То, что я хочу сделать, это когда вы нажимаете на элемент, у которого есть набор для рендеринга другого компонента. Но что происходит со мной, так это когда другой компонент не отображается, поскольку предыдущий не завершил загрузку имеющихся у него изображений. Так разве нет способа, которым, даже если я загружаю изображения, я изменяю свой компонент и не ожидаю, что он загрузит все, чтобы go к другому компоненту?

Здесь я оставляю свой код там, где у меня есть маршруты и как я вызываю другой компонент через ссылку.

  return (
      <BrowserRouter>                
        <Route exact path="/viewService/:id" component={VerServicio} />
        <Route exact path="/login" component={Login} />
        <Route exact path="/signup" component={Register} />
        <Route exact path="/myprofile" component={MyProfile} />
        <Route exact path="/newservice" component={NewService} />
        <Route exact path="/editservice/:id" component={NewService} />
        <Route exact path="/pruebas" component={Pruebas} />
        <Route component={Home} />
      </BrowserRouter>      
      // <NewService></NewService>
  );
}```

<Link to={{ pathname: "/viewService/" + currentData.id, state: {currentData}}}>
    <input type="hidden" id="serviceID" name="serviceID" value={currentData.id} />
    <input type="hidden" id="userID" name="userID" value={currentData.user_id} />
    <img className="card-img-top" alt={currentData.alt} src={(this.props.url+currentData.serviceImage[0].attachment)}></img>
    <div className="card-body card-mod-text">
        <h6 className="card-text mt-1 font-weight-bold">{currentData.title}</h6>
        <p className="card-text font-weight-bold">{currentData.price}€/h · <span className="texto-dis">25 km de mi</span></p>
    </div>
</Link>