tengo dos variables de estado
const [cartList, setCartList] = useState([]); const [tabledata, setTabledata] = useState(localStorage.getItem("items")) tableData se inicia desde el almacenamiento local
cartList será una matriz de objetos con una lista completa y un ejemplo será como
[ {id: 1, name: pen, sku: 1001, price: 5}, {id: 2, name: a4-book, sku: 1005, price: 2}, {id: 3, name: usb-16gb, sku: 1010, price: 15}, {id: 4, name: usb-32gb, sku: 1021, price: 28} ] tableData también es una matriz de objetos y tendrá algunos elementos y un ejemplo será como
[ {id: 2, name: a4-book, sku: 1005, price: 1.5}, {id: 4, name: usb-32gb, sku: 1021, price: 22} ] cartList tiene mi precio más reciente para cada artículo, quiero actualizar los datos de la tabledata para obtener el precio de los artículos correspondientes (por id) de cartList cada 5 minutos.
¿Cuál es la mejor manera de lograr esto continuamente? Entonces, ¿el precio del elemento tabledata está actualizado con el precio cartList para los artículos correspondientes?
Puede obtener cartList y actualizar tableData y localStorage inmediato. Sin embargo, para hacer esto cada 5 minutos, simplemente envuelva la llamada de búsqueda en una llamada setInterval() .
const FIVE_MINUTES_MS = 5 * 60 * 1000; useEffect(() => { const interval = setInterval(() => fetch("/api/cartlist") .then(res => res.json()) .then(list => { setCartList(list); const tableDataNew = tableData.map(item => ({ ...item, price: list.find(cartItem => cartItem.name === item.name).price })); setTableData(tableDataNew); localStorage.setItem("items", JSON.stringify(tableDataNew)); }) .catch(err => console.error(err)), FIVE_MINUTES_MS); return () => clearInterval(interval); }, []); Lo importante que hay que entender aquí es que copio los precios actualizados de cartList después de obtenerlos y luego actualizo tableData mientras los almaceno en localStorage .
La declaración de devolución es para detener este proceso, por ejemplo, cuando el componente se desmonta.
No he probado esto, pero espero que esto dé una idea del flujo.