Javascript 在每个承诺解析后调用Blazor JsInterop

尝试在Blazor服务器端应用程序中正常工作。我有一个Uploader组件，但在客户端解决每个承诺后，它不会调用Easync。它等待加载所有图像，然后调用C#方法。如何让它在加载每个图像后调用C#方法

我知道JavaScript是单线程的，但也尝试过web工作人员，并且仍然做同样的事情

回购协议样本可在此处找到

我知道发生了什么

---

如果我的想法正确，它应该能够从javascript文件中并行调用异步C#方法。

这个问题与Blazor和JS有关。在JS上，您不需要等待

GenerateImageData

您应该改用现代的

for…of

循环，其中

await

将按预期工作：

GetFileInputFiles = async (instance, fileInput) => {
    var files = Array.from(fileInput.files);
    for (const image of files) {
        var imagedata = await readUploadedFileAsText(image);
        console.log("sending");
        _ = await instance.invokeMethodAsync('GenerateImageData', imagedata);
        console.log("sent");
    };
};

关于Blazor，我建议您将

GenerateImageData

重写为：

    [JSInvokable]
    public async Task GenerateImageData(string data)
    {
        System.Console.WriteLine( "Receiving"  );
        ImageBase64.Add(data);
        await Task.Delay(1);
        StateHasChanged();
        System.Console.WriteLine( "Received"  );
    }

结果:

• 关于JS问题的更多详细信息：
• 有关Blazor问题的更多详细信息：

GeneratePreviewImages=async（dotNet，fileInput）=>{
const files=Array.from（fileInput.files）；
const imageSrcs=files.map（file=>getPreviewImageSrc（file））；
循环（imageSrcs、dotNet）；
};
const loop=async（arr，dotNet）=>{
等待（arr的常数src）{
console.log（src）；
dotNet.invokeMethodAsync（'GenerateImageData'，src）；
}
};
const getPreviewImageSrc=async（文件）=>{
返回URL.createObjectURL（文件）；
};

非常感谢您的帮助！！！最终以一种稍微不同的方式完成，但您的知识会导致进行更多搜索，并找到更好的解决方案来预览图像。今晚我会用新代码更新回购协议。