Блог

Я загружаю разные htmlстраницы внутри Iframe в серверном приложении blazor. Чтобы изменить содержимое Iframe, я использую несколько кнопок. При нажатии кнопки в Iframe загружается соответствующая Html-страница (один Iframe — разное содержимое — изменен нажатием кнопки).

Как я могу проверить, полностью ли загружено содержимое после щелчка? Причина этого в том, что прямо сейчас, если пользователь нажимает разные кнопки для быстрого перехода одна за другой, Iframe вообще не отображает содержимое (только фоновый цвет базовой сетки и столбы). Могу ли я получить обратно значение bool после завершения загрузки Iframe?

Пожалуйста, я не был бы в Blazor, если бы у меня были знания из Js. Я нашел сообщения, в которых js является решением для этого, но. Я не знаю, как правильно внедрить это в мое приложение blazor. Я не могу просто скопировать этот js в hmtlpage. Он должен быть в файле _Host.cshtml, но если я помещу его туда…документ.querySelector(‘myIframe’).addEventListener… в консоли developmenttools указано значение null. Спасибо за помощь. Пожалуйста, если это связано с js, будьте так добры и попытайтесь объяснить это мне, как вы бы объяснили nuub (что я имею в виду :).

 <script type="text/javascript">
        document.querySelector('myIframe').addEventListener("load", ev => {
            console.log('iframe is completely loaded');
        })
</script> 

Blazor может абсолютно получать DOM-события, и вы можете присоединяться к событиям непосредственно в коде razor без необходимости использования JS, чтобы вы могли писать свою логику с помощью C #.

Хитрость заключается в том, чтобы префикс события с @ , как @onload в вашем примере, который затем принимает EventCallback / Метод в качестве параметра.

 <iframe src="https://some.embeddedsite.com" @onload="IFrameLoaded" />

@code {
    private void IFrameLoaded(ProgressEventArgs e)
    {
        Console.WriteLine("IFrame loaded");
    }
}
 

Смотрите документы по ASP.NET Основная обработка событий Blazor для получения дополнительной информации.

Но можно также задаться вопросом, почему старомодный способ, который вы пытаетесь использовать сейчас, не работает… И на это у меня нет ответа, более того, я тоже боролся с тем же самым в прошлом. Кажется, blazor использует события для самостоятельной поддержки, и при этом часто «настроенные вручную» события теряются. Однако в последнее время у меня было меньше проблем с этим, поскольку я больше придерживался «блейзорского пути» ведения дел.