如何在加载页面之前在UWP中预加载数据?使用MVVM和Windows Template Studio

Question

这样做的最佳实践是什么？请记住，我使用的是MVVM模式和Windows模板工作室。因此，如果有一些内置的数据加载解决方案/最佳实践，我很想知道这一点。

我正在通过http从API异步加载数据，这需要几秒钟的时间。因此，当用户点击页面时，他必须等待一段时间才能显示数据。我希望在用户点击页面之前预装数据。应该在应用程序启动时加载页面数据。

这是我现在将数据加载到页面的代码：

XAML

<i:Interaction.Behaviors>
<ic:EventTriggerBehavior EventName="Loaded">
<ic:InvokeCommandAction Command="{x:Bind ViewModel.LoadedCommand}" />
</ic:EventTriggerBehavior>
</i:Interaction.Behaviors>

ViewModel:

public ICommand LoadedCommand => loadedCommand ?? (loadedCommand = new RelayCommand(LoadData));
private async void LoadData()
{
await LoadItemsAsync();
await LoadImagesAsync();
}
private async Task LoadItemsAsync()
{
var items = await itemsDataAccess.GetAllAsync();
foreach (Item i in items)
ItemImageLinks.Add(new ItemImageLink() { Item = i });
}
private async Task LoadImagesAsync()
{
if (!InternetConnectionService.IsConnected())
return;
foreach (ItemImageLink iml in ItemImageLinks)
iml.Image = await imagesDataAccess.GetImageAsync(iml.Item.ImageStringName);
}

Answer 1

您可以使用Lazy和Task类的组合。

字段声明：

private Lazy<Task<ItemImageLink[]>> ItemImageLinks;

构造函数中的初始化：

ItemImageLinks = new Lazy<Task<ItemImageLink[]>>(() => Task.Run(async () =>
{
return await itemsDataAccess.GetAllAsync()
.Select(item => new ItemImageLink() { Item = item })
.ToArray();
}));

PreLoad预加载方法：

await ItemImageLinks.Value;

任何地方都可以使用：

foreach (ItemImageLink item in await ItemImageLinks.Value)
{
// Do something with the item
}

---

更新：只有当您必须在任意时间点进行预加载时，才需要Lazy包装器。如果您总是在构造函数中立即预加载，那么一个简单的Task<ItemImageLink[]>就足够了。