Estoy trabajando con un Alpine.data global y estoy buscando concatenar matrices cuando se dispara mi método loadJobs . No estoy familiarizado con los proxies en JS y realmente no entiendo por qué mi propiedad data devuelve un objeto Proxy en lugar de una matriz simple.
Aquí está la pieza de código con la que estoy trabajando:
jobState = { low: 5, high: 10, isLoaded: false } document.addEventListener("alpine:init", () => { Alpine.data("loadMoreJobs", () => ({ data: [], loadJobs() { // Update jobState jobState.low = jobState.high jobState.high += 5 const requestParams = { dataType: 'json', method: 'GET' } fetch(`http://127.0.0.1:3000/jobs/list/${jobState.low}/${jobState.high}`, requestParams) .then((data) => { return data.json() }) .then((data) => { this.data = [...this.data, data] }) } })) })data cierra la sesión como Proxy porque así es como funciona la reactividad de Alpine.js: envuelve todos los objetos relevantes en Proxy para incorporar cambios en dichos objetos.
Los proxies deberían funcionar igual que las estructuras de datos subyacentes, la única diferencia es que Alpine puede conectarse a operaciones en el proxy (reasignación, mutación, etc.).
Como se menciona en el hilo de comentarios. Una forma de desenvolver el Proxy y obtener una copia de la estructura de datos original es usar JSON.parse(JSON.stringify(data)) (u otro enfoque de clonación profunda, por ejemplo, clon structuredClone que aún no está ampliamente disponible ).