Серверная сторона Blazor не обновляет значение класса, когда StateHasChanged - PullRequest
Новая
       21

Серверная сторона Blazor не обновляет значение класса, когда StateHasChanged

0 голосов
/ 03 августа 2020

У меня есть серверное приложение Blazor, которое показывает некоторые статьи с изображениями, которые загружаются через JS "lazysizes. js" (https://github.com/aFarkas/lazysizes).

В Blazor эта часть компонента ArticleComponent отвечает за содержимое: 

<div class="article-img">
    @if (Article.HasImageUrl)
    {
        <picture>
            <source data-srcset="img/@AppState.MultiStore.Key/@(Article.ImageUrlWebP)" type="image/webp">
            <img data-src="img/@AppState.MultiStore.Key/@Article.ImageUrl" class="lazyload" alt="@Article.ImageUrl" />
         </picture>
     }
</div>
  1. Когда все статьи загружены, правильные изображения лениво загружаются правильным способом (изображение R1 в data-srcset и после ленивая загрузка также в sr c / srcset). 
<div class="article-img">
    <picture>
        <source data-srcset="img/KAORU/R1.webp" type="image/webp" srcset="img/KAORU/R1.webp">
        <img data-src="img/KAORU/R1.png" class=" lazyloaded" alt="R1.png" src="img/KAORU/R1.png">
    </picture>
</div>
Теперь при вводе в текстовое поле поиска элементы фильтруются по этой строке и перекрашиваются через Blazor (старый на этой позиции DIV, в данном случае V6_gurkensalat.webp вместо R1.webp). 
    <div class="article-img">
        <picture>
            <source data-srcset="img/KAORU/R1.webp" type="image/webp" srcset="img/KAORU/V6_gurkensalat.webp">                        
            <img data-src="img/KAORU/R1.png" class=" lazyloaded" alt="R1.png" src="img/KAORU/V6_gurkensalat.png">
        </picture>
    </div>

enter image description here

  1. Проблема в том, что движок «запоминает» класс CSS и значение sr c тега picture / image HTML.

Ручным решением было бы изменить класс с "lazyloaded" на "lazyload", чтобы обновить sh изображение (как описано в этой ссылке: https://github.com/aFarkas/lazysizes/issues/46)

Проблема в том, почему Blazor не обновляет класс / sr c обратно до того, что объясняется в исходном коде, и как я могу «научить» Blazor полностью обновляться, чтобы отображать правильные изображения?

Спасибо!

...