Blazor:在Blazor(不是.js)中计算文本区域中的字符数

Question

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

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

我可以在.js中做到这一点，没有问题，但这种情况需要本机解决方案&尽管我很喜欢"答案"，但用手指指向可以让我少问问题的资源同样受欢迎——只是不是官方的MS文档，我需要它的编写水平让在新环境中工作的UI开发人员能够理解：：grin:：

此外，如果有人想参与Blazor UI框架(在很大程度上，他们可能能够帮助自动化像这样的任务-这是我第一个在网上找不到至少部分答案的框架(，我有预算购买一个，但我没有时间测试几个，所以我现在没有(没有在Blazor工作的联系人，我认识的每个人都是C++、.JS、PHP等(.

如果我对我的目标不够清楚，这不是我(它是.js和我需要一个c#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