如何通过单击 MudBlazor 中的 MudTabPanel 来运行方法答案

【问题标题】：How to run a Method by clicking on MudTabPanel in MudBlazor如何通过单击 MudBlazor 中的 MudTabPanel 来运行方法
【发布时间】：2022-11-25 21:36:17
【问题描述】：

我想使用选项卡使用组件“MyBox”的背景颜色进行操作。组件的背景必须填充颜色，在选项卡中命名。一个条件：不允许从代码中删除 @bind-ActivePanelIndex="activeIndex"（它用于其他目的）。我有一个方法“SetColor”，但我不知道如何运行它。我会感谢任何帮助。

索引.razor

<MudTabs Elevation="0" Outlined="true" @bind-ActivePanelIndex="activeIndex">
    <MudTabPanel Text="Red"></MudTabPanel>
    <MudTabPanel Text="Blue"></MudTabPanel>
</MudTabs>

<MyBox colorBox="@colorMe"/>

@code
{
    int activeIndex = 0;
    string colorMe = "";
    
    void SetColor()
    {
        if(activeIndex == 0)
        {
            colorMe = "red";
        } 
        else if(activeIndex == 1)
        {
            colorMe = "blue";
        } 
    }
}

MyBox.razor

<MudItem Style="@($"background-color:{colorBox}; padding:10px; border:1px solid black")">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eum sit praesentium eos impedit. Est delectus non fugiat perferendis, quos et quis fugit iusto laborum esse voluptates sequi harum quo ab.
</MudItem>

 
@code {
  [Parameter]
  public string colorBox {get; set;}
}

【问题讨论】：

标签： c# blazor mudblazor

【解决方案1】：

您可以在选项卡单击时执行您的功能，并将您的颜色作为参数提供给您的功能。例如：

<MudTabPanel Text="Red" OnClick="() => SetColor(YourParameter)"></MudTabPanel>

【讨论】：