【问题标题】:MudChip two way binding in MudBlazor?MudBlazor 中的 MudChip 双向绑定?
【发布时间】:2021-08-23 20:32:50
【问题描述】:

我正在将 MudBlazor 与 Blazor 服务器端一起使用,并且我正在尝试双重绑定 MudChip。我想保存在数据库中选择的芯片并在稍后检索数据并将芯片预渲染为选定的。基本上是在芯片上做双重绑定。它似乎没有工作,我尝试过:

  1. 在 OnInitialized 方法中创建一个新芯片并在 SelectedChip 属性上设置属性(Text、Color、IsSelected):

<MudContainer>
                  <MudText Style="display:inline;color:white">Goal Type</MudText>
                  <MudChipSet @bind-SelectedChip="md"  Style="display:inline;" Filter="true">
                      <MudChip  Text="Financial" Color="Color.Dark">Financial</MudChip>
                      <MudChip Text="Personal" Color="Color.Dark">Personal</MudChip>
                  </MudChipSet>
</MudContainer>

这是代码:

MudChip md;

  protected override void OnInitialized()
  {
        Init();
  }

  public void Init()
  {
        if (md == null)
        {
            md = new MudChip { Color = Color.Dark, Text = "Financial", IsSelected = true };
        }
  }
  1. 创建对所选芯片的引用:

<MudChipSet @bind-SelectedChip="md" @onselect="OnSelect" Style="display:inline;" Filter="true">
                        <MudChip Text="Financial" Color="Color.Dark">Financial</MudChip>
                        <MudChip @ref="personal" Text="Personal" Color="Color.Dark">Personal</MudChip>
     </MudChipSet>

这是代码:

MudChip md;
 MudChip personal;

 protected override void OnInitialized()
 {
        if(md is null)
        {
            md = personal;
        }
 }

这些方法都不起作用,你知道双重绑定是否可能吗?我还在 GitHub 页面上进行了询问,其中一位贡献者说,通过使用提供的示例,这是可能的。对我来说,它们没有多大帮助。这是 GitHub 问题:

https://github.com/Garderoben/MudBlazor/discussions/1791

【问题讨论】:

  • OnInitialized 在第一次渲染之前被触发,所以当你设置md=personalpersonal 仍然为空。当 firstRender 为真时,将该代码移至 OnAfterRender(bool firstRender)
  • @MisterMagoo 该死的,它成功了,谢谢。

标签: blazor blazor-server-side mudblazor


【解决方案1】:

OnInitialized 在第一次渲染之前触发,因此当您设置 md=personal 时,personal 仍将为空。

当 firstRender 为真时,将该代码移至 OnAfterRender(bool firstRender)

【讨论】:

    猜你喜欢
    • 2021-03-02
    • 2010-09-24
    • 2020-04-04
    • 1970-01-01
    • 2020-06-03
    • 1970-01-01
    • 2015-04-26
    • 2016-04-19
    • 2012-05-25
    相关资源
    最近更新 更多