Hi,
I hope I may ask for some help with the RadzenTabs Component. I guess I missconfigured (or misunderstood) something.
Please consider this the following small project (@rendermode="InteractiveServer") to demonstrate the issue.
When I set a breakpoint in the OnParametersSetAsync function of the FooComponents it is hit multiple times when I toggle between the tabs.
This happens with TabRenderMode.Server and TabRenderMode.Client. Is there a way to avoid this? Or is this expected and I am missing something?
The Home page looks like this:
@page "/"
@inherits HomeBase
@using Radzen
@using Radzen.Blazor
<PageTitle>Home</PageTitle>
<RadzenTabs Change=@OnTabChange TabPosition="TabPosition.Top" RenderMode="TabRenderMode.Client">
<Tabs>
<RadzenTabsItem Text="Foo">
<FooComp dummyObjects=@dummyObjects["Foo"] />
</RadzenTabsItem>
<RadzenTabsItem Text="Bar">
<FooComp dummyObjects=@dummyObjects["Bar"] />
</RadzenTabsItem>
<RadzenTabsItem Text="Baz">
<FooComp dummyObjects=@dummyObjects["Baz"] />
</RadzenTabsItem>
</Tabs>
</RadzenTabs>
Here's the code:
using Microsoft.AspNetCore.Components;
namespace TabsIssue.Components.Pages
{
public class HomeBase : ComponentBase
{
protected Dictionary<string, List<DummyObject>> dummyObjects = new();
protected override Task OnInitializedAsync()
{
dummyObjects["Foo"] = new List<DummyObject>
{
new DummyObject { IntProp = 1, StringProp = "Foo 1" },
new DummyObject { IntProp = 2, StringProp = "Foo 2" }
};
dummyObjects["Bar"] = new List<DummyObject>
{
new DummyObject { IntProp = 3, StringProp = "Bar 3" },
new DummyObject { IntProp = 4, StringProp = "Bar 4" }
};
dummyObjects["Baz"] = new List<DummyObject>
{
new DummyObject { IntProp = 5, StringProp = "Baz 5" },
new DummyObject { IntProp = 6, StringProp = "Baz 6" }
};
return base.OnInitializedAsync();
}
protected void OnTabChange(int index)
{
}
}
}
FooComp.razor:
@inherits FooCompBase
<ul>
@foreach(var dummyObj in dummyObjects)
{
<li @key="@dummyObj.StringProp">
<span>@dummyObj.StringProp @dummyObj.IntProp</span>
</li>
}
</ul>
FooComp.razor.cs:
using Microsoft.AspNetCore.Components;
namespace TabsIssue.Components
{
public class FooCompBase : ComponentBase
{
[Parameter]
public List<DummyObject> dummyObjects { get; set; }
protected override Task OnParametersSetAsync()
{
return base.OnParametersSetAsync();
}
}
}
and the DummyObject:
type or paste code here
namespace TabsIssue
{
public class DummyObject
{
public int IntProp { get; set; }
public string StringProp { get; set; }
}
}
As always: thanks for your support. Highly appreciated!
Cheers!
TabsIssue.zip (363.9 KB)