我试图在Blazor中复制一个简单的JS方法。这个想法是在给定的单词/句子等中键入每个字符。W3Schools有一个很好的例子可以快速做到这一点。那么,举他们的例子,在C#中如何做与JS中相同的事情呢?
var i = 0;
var txt = 'Lorem ipsum dummy text blabla.';
var speed = 50;
function typeWriter() {
if (i < txt.length) {
document.getElementById("demo").innerHTML += txt.charAt(i);
i++;
setTimeout(typeWriter, speed);
}
}
我确信这不是一个很好的方法,因此来到这里,但我认为必须有一种方法通过线程来做与setTimeout
相同的事情,只是不知道如何使用兴奋剂。还试图通过代码后面的变量来更新HTML。
以下是我迄今为止所尝试的:
HTML:
<div>
@message
</div>
Blazor代码背后:
using System.Threading;
namespace MyApp.Pages
{
public partial class Index
{
private static string message = "";
private static string toType = "Lorem ipsum dummy text blabla.";
private static int charIndex = 0;
protected override void OnInitialized()
{
int seconds = 5000;
var timer = new Timer(TypeMessage, null, 0, seconds);
}
protected static void TypeMessage(object o)
{
if (charIndex < toType.Length)
{
message = message + toType[charIndex];
charIndex++;
}
}
}
}
任何关于什么是最好的方法的建议都将不胜感激!
尝试类似的东西
Task.Run(async() =>
{
for (int i=1; i <= Message.Length; i++)
{
TextToShow = Message.Substring(0, i);
InvokeAsync(StateHasChanged);
await Task.Delay(500);
}
}) ;
调用InvokeAsync(StateHasChanged)
应该工作:
...
protected static void TypeMessage(object o)
{
if (charIndex < toType.Length)
{
message = message + toType[charIndex];
charIndex++;
InvokeAsync(StateHasChanged);
}
}