Blazor Virtualize 功能记坑

仅作笔记

起因是准备做一个小说阅读的app，我喜欢上下互动的看书模式，所以存在一个技术点：虚拟滚动

查了资料,Virtualize 可以解决，网上找了很多资料，都不行

最终发现外层height必须设置为固定高度，至此问题圆满解决

 

 

<div style="height:700px;width:1200px;overflow-y:scroll" tabindex="-1">
<Virtualize ItemsProvider="LoadItems" OverscanCount="1" ItemSize="600">

<ItemContent>
<div>
<div>@context.Name</div>
<div>@context.Complete</div>
@* 设置内容超了就自动换行 *@
<div style="word-wrap:break-word">@context.Address</div>

</div>
</ItemContent>
<EmptyContent>
<p>
There are no strings to display.
</p>
</EmptyContent>
<Placeholder>
<p>
Loading&hellip;
</p>
</Placeholder>
</Virtualize>
</div>