How to open new screen on ReactJS on Web

How to open InvokeScreen Thank you very much.

This is App.js

import React from "react";
import { Grid } from "semantic-ui-react";
import QueryAllCars from "./components/queryAllCars";

const App = () => {
return (
<div>
 <QueryAllCars/>
</div>
);
};

export default App;

This is QueryAllCars.js

import React, { useEffect } from "react";
import { Button } from "semantic-ui-react";

const QueryAllCars = () => {
return (
<div>
 <Button onClick={moveToInvokeScreen}>Move to InvokeScreen</Button>
</div>
);
};

const moveToInvokeScreen = () => {
   //???????What code is here??? 
}
export default QueryAllCars;

This is InvokeScreen file

import React, { useEffect } from "react";
import { Button } from "semantic-ui-react";

const InvokeScreen = () => {
return (
  <div>
    Invoke Screen
  </div>
);
};
export default InvokeScreen;

What code is here???

const moveToInvokeScreen = () => {
 //???????What code is here??? 
}

Please help me. How to open InvokeScreen Thank you very much.