Компонент Blazor (в библиотеке) и JSInterop

Question

Я создал компонент Blazor в полном проекте Blazor, и все работает хорошо. Однако, когда я перемещаю этот компонент в его собственный проект библиотеки классов Razor, я получаю сообщение об ошибке, что я не могу использовать JSInterop, пока не будет установлено соединение с сервером. Я запускаю свой код в методе OnAfterRenderAsync().

Когда я вносил изменения, мне пришлось немного изменить код. В полном проекте Blazor JSInterop предоставляется с DI в классе Startup. Но с библиотекой calss дело обстоит иначе.

Поэтому вместо "@inject JSInterop js" на странице мне пришлось настроить его так:

  private IJSRuntime js { get; set; }

  protected override void OnInitialized()
  {
    js = ScopedServices.GetRequiredService<IJSRuntime>();
  }

Судя по отрывочным деталям, доступным в Интернете, я предполагаю, что он получает услугу от родительского проекта.

Используя отладку, я вижу, что js НЕ равен нулю. Похоже, что это действительный объект.

Может кто-то указать мне верное направление?

Answer 1

Нашел решение моей проблемы, и мой первоначальный вопрос стал неактуальным. Когда я скопировал свой компонент в его собственный проект библиотеки классов, он не компилировался. Это дало мне ошибку в строке @inject JSInterop js.

Это заставило меня поверить, что он не знал, как внедрить это, поскольку он не установлен во время запуска проекта, как в приложении Blazor. Итак, я сколотил код, чтобы получить ссылку через ScopedServices.GetRequiredService(). Это действительно создало объект, но не установил _clientProxy, который содержит соединение с сервером.

Итак, покопавшись, мне удалось найти полный пример проекта библиотеки компонентов на веб-сайте BlazorHelp. Здесь действительно был введен JSInterop в файл Blazor. Поэтому я вернул свой код к исходному коду, который работал в полном проекте, и попытался скомпилировать. Это дало мне ту же ошибку. Поэтому я удалил строку @inject JSInterop js и снова ввел ее. ОНА ЭТО ПРИЗНАЛА!!! Он по-прежнему не компилируется, не распознает настраиваемый тип (Pivot) и не спрашивает, добавил ли я на него ссылку.

[CascadingParameter] public Pivot OwnerPivot { get; set; }

Я удалил слово Pivot, набрал его заново, и, вуаля, он компилировался.

Таким образом, похоже, что в VS2019 или компиляторе razor есть какая-то ошибка, когда удаление кода в исходном файле и повторный ввод заставили его распознать и скомпилировать.

Answer 2

Сервер выполняет предварительную визуализацию, поэтому ваш код будет запущен до того, как будет установлено соединение клиента с сервером. При рендеринге в OnAfterRenderAsync вы должны использовать IJSRuntime только тогда, когда параметр firstRender имеет значение true, или в любой момент после этого, но никогда раньше.