Blazor：计算 Blazor 文本区域中的字符（不是 .js）

Question

我有一个输入 textarea，我正在限制（完成）的字符数，我还想提供有关剩余字符数的视觉反馈。这是我的文本区域：

<textarea type="text" name="TheNameOfMyField" class="TheNameOfMyClass" value="" rows="2" maxlength="255"></textarea>

我可以在 .js 中做到这一点，没问题，但这种情况需要一个本地解决方案，尽管我很喜欢“答案”，但同样欢迎指向资源的手指使我能够提出更少的问题 - 只是不是官方的 MS 文档，我需要以在新环境中工作的 UI 开发人员可以理解的级别编写它::grin::

此外，如果有人想权衡 Blazor UI 框架（以至于他们可能能够帮助自动化这样的任务 - 这是我无法在网上找到至少部分答案的第一个），我有购买一个的预算，但我没有时间测试几个，所以我目前没有（没有在 Blazor 工作的联系人，我认识的每个人都是 C++、.JS、PHP 等）。

如果我对我的目标不够清楚，这不是我（它是 .js 并且我需要 ac# Blazor 解决方案），但从概念上讲它非常接近（除非我将限制该字段中的字符数，所以没有负数）：

https://www.itrelease.com/2011/05/count-characters-in-text-area-using-javascript/'

干杯!

Answer 1

你在寻找这样的东西吗？

<textarea @bind="text"
          @bind:event="oninput"
          maxlength="@MAX_TEXT_COUNT" />
<label>Chars left: @(MAX_TEXT_COUNT - text.Count())</label>

@code {
    string text = "1234";
    const int MAX_TEXT_COUNT = 5;
}

在@bind="text"和@bind:event="oninput"会告诉blazor更新text上的每个按键变量。这maxlength="@MAX_TEXT_COUNT"将阻止用户输入比MAX_TEXT_COUNT

在<label>Chars left: @(MAX_TEXT_COUNT - text.Count())</label>刚刚打印出的差异。

这是在线测试的片段：https : //blazorrepl.com/repl/GYOrRkbb5532bvYW23