Blazor: Вызов js-кода и работа с состоянием

Blazor: Вызов js-кода и работа с состоянием


Технология blazor позволяет запускать C# код в WebAssembly.

WebAssembly на данный момент поддерживается следующими браузерами:

  • Google Chrome — wasm поддерживается с версии 57
  • Mozilla FireFox — поддержка wasm появилась в версии 52
  • Safari — поддерживается начиная с версии 11
  • Microsoft Edge — поддерживается начиная с версии 1


Blazor работает так, что возможно вызывать код JavaScript, из чего следует, что возможен постепенный переход с JavaScript на blazor на уже существующих проектах.

Ниже представлен пример вызова функции JavaScript из кода blazor (за основу взят стандартный шаблон blazor. Инструкция по установке стандартного шаблона)

Исходный проект на github

Код страницы Blazor

Все свойства на шаблоне являются реактивными :)

Свойство bind позволяет создать двустороннюю привязку свойства Name, то есть:

Если вы изменили Name из кода-input так же обновится

Если вы изменили Name в input-везде, где данное свойство используется оно обновит своё состояние.

Как в любом spa-фреймворке!

Код JS

В итоге получаем:

Инициализирующее состояние
Js вернул строку
Js вернул Джона Сноу




Report Page