Blazor Webassembly中的父组件未更新

问题描述

我对Blazor还是很陌生,所以这个问题可能更多的是逻辑问题,而不是实际的编码问题。基本上,我的父组件是基于子组件的列表呈现一个列表。问题是列表没有被更新。

为简单起见,我为此问题制作了一个小型演示。这是我的主要组成部分:

@page "/"

<Counter @ref="MyCounter" />

<ul>
    @if (MyCounter?.TheList != null) 
    {
        @foreach (string s in MyCounter.TheList)
        {
            <li>@s</li>
        }
    }
</ul>

@code {
    Counter MyCounter;
}

这是我的计数器组件:

<div>
    <button @onclick="AddToList">Add to list</button>
</div>

@code {
    public List<string> TheList {get;set;} = new List<string>();
    private Random Rnd = new Random();

    private void AddToList()
    {
        int length = 5;
    
        var str_build = new System.Text.StringBuilder();        

        char letter;  
        for (int i = 0; i < length; i++)
        {
        double flt = Rnd.NextDouble();
        int shift = Convert.ToInt32(Math.Floor(25 * flt));
        letter = Convert.ToChar(shift + 65);
        str_build.Append(letter);  
        }

        TheList.Add(str_build.ToString());
        Console.WriteLine($"Added to the list: {str_build.ToString()}");
        Console.WriteLine($"The list now has {TheList.Count} items");        
    }
}

我希望看到的行为是每次单击按钮时,我应该看到<ul>标记中弹出新添加的字符串。但是,实际上发生的事情是什么也没有渲染。控制台日志显示了新字符串以及列表中的项目数,这都是正确的。 Blazor只是不重新渲染,可能是因为我不得不以某种方式通知它需要重新渲染。如何使我的预期行为起作用?

我制造了一个问题here的小提琴。

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)