How to use useState() throughout multiple pages

Question

My first page looks something like this:

import { useState } from "react";
import React, { useEffect } from "react";

export const addItem = (ID, Name, Price, Img, Quantity, Color) => {
  setCartItems(ID, Name, Price, Img, Quantity, Color) // <-- this is the thing
}

function Navigation () {
  const [cartItems, setCartItems] = useState([]);
  ...
}

export default Navigation;

On the second page I have a button which when pressed, would call the first page's addItem function. The problem is (I have pointed to it in the code) that I can't call the setCartItems function from outside the Navigation function. Is there any solution to this problem, I don't mind it being something different from useState() as long as it works. I am using react-router for the pages if that helps.