I'm trying to create a control that opens a razor component and displays the objects sent to the page after a user clicks a Print button. Using the IJSRuntime.InvokeAsync() the blank page opens to a blank component page but the objects are not being captured.
Here is the button onclick event-
public async Task PrintViewableOrderPackingSlips()
{
OrdersToPrint = OrdersToPack.Where(o => o.IsOrderVisible).ToList();
await IJS.InvokeAsync<object[]>("open", "/PrintPackingSlip", "_blank", new object[]{ OrdersToPrint });
}
That invokes this razor component page
@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; }
}
Obviously I'm not capturing the object passed over because I get this error in the originating page
Uncaught (in promise) TypeError: cyclic object value
and this error in the new component window
Uncaught (in promise) Error: Found malformed component comment at Blazor:{"sequence":0,"type":"server","prerenderId":"aa8c4268d131416eb85784e2fcf8549f","descriptor":
How can I pass my list of objects to the new component?
Ended up using the library Blazored.LocalStorage to store the data and IJSRuntime to open a new blank window in another tab then on my blank page get the data.
@inject ILocalStorageService localStorage;
public async Task PrintViewableOrderPackingSlips()
{
await localStorage.SetItemAsync("orderList", ordersToPrint);
await IJS.InvokeVoidAsync("window.open", new[] {"/PrintPackingSlip", "_blank"});
}
Then in the page I want the data..
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");
}
}
Now the only problem with local storage is it's limited to 5mb and depending on the size of my List that I am sending it will not render. So I'm guessing IndexedDb is the option for me instead.