Estoy tratando de crear un control que abra un componente de afeitar y muestre los objetos enviados a la página después de que un usuario haga clic en el botón Imprimir. Con IJSRuntime.InvokeAsync(), la página en blanco se abre en una página de componentes en blanco, pero los objetos no se capturan.
Aquí está el botón onclick event-
public async Task PrintViewableOrderPackingSlips() { OrdersToPrint = OrdersToPack.Where(o => o.IsOrderVisible).ToList(); await IJS.InvokeAsync<object[]>("open", "/PrintPackingSlip", "_blank", new object[]{ OrdersToPrint }); }
Eso invoca esta página de componentes de la maquinilla de afeitar.
@layout Blazing_Fruit.Pages.BlankLayout @page "/PrintPackingSlip" <body onload="window.print()"> <Div>print page</Div> </body> @code{ [Parameter] public JsonContent orders { get; set; } [Parameter] public List<UnshippedOrder> value { get; set; } }
Obviamente, no estoy capturando el objeto pasado porque aparece este error en la página de origen.
No capturado (en promesa) TypeError: valor de objeto cíclico
y este error en la ventana del nuevo componente
Error no capturado (en promesa): comentario de componente mal formado encontrado en Blazor:{"secuencia":0,"tipo":"servidor","prerenderId":"aa8c4268d131416eb85784e2fcf8549f","descriptor":
¿Cómo puedo pasar mi lista de objetos al nuevo componente?
Terminé usando la biblioteca Blazored.LocalStorage para almacenar los datos e IJSRuntime para abrir una nueva ventana en blanco en otra pestaña y luego en mi página en blanco obtener los datos.
@inject ILocalStorageService localStorage; public async Task PrintViewableOrderPackingSlips() { await localStorage.SetItemAsync("orderList", ordersToPrint); await IJS.InvokeVoidAsync("window.open", new[] {"/PrintPackingSlip", "_blank"}); }
Luego en la pagina quiero los datos..
protected override async Task OnAfterRenderAsync(bool firstRender) { if (firstRender) { var stringResults = await localStorage.GetItemAsync<string>("orderList"); ordersToPrint = JsonSerializer.Deserialize<List<UnshippedOrder>>(stringResults).ToList(); StateHasChanged(); await localStorage.RemoveItemAsync("orderList"); } }
Ahora, el único problema con el almacenamiento local es que está limitado a 5 mb y, dependiendo del tamaño de mi Lista que estoy enviando, no se procesará. Así que supongo que IndexedDb es la opción para mí.