不同視圖的ViewModel初始化方法

Question

我有一個TabbedPage，它顯示進行中的交貨和已完成的交貨。 兩種視圖的模型相同，只是從中獲取數據的服務方法不同，因此我想重用ViewModel。

通過將一些導航數據傳遞到InitializeAsync方法中來重用ViewModel，這將是一個很好的解決方案，該方法可以讓我決定使用哪種服務方法來獲取視圖數據？

我將在TabbedPage View的代碼中覆蓋OnCurrentPageChanged並從那里初始化ViewModel

TabbedPageView.xaml.cs

    protected override async void OnCurrentPageChanged()
    {
        base.OnCurrentPageChanged();
        if (!(CurrentPage.BindingContext is TabbedPageViewModel tabbedPageViewModel)) return;
        if (CurrentPage == DeliveriesInProgress)
        {
            await tabbedPageViewModel.InitializeAsync("DeliveriesInProgress");
        }
        else if (CurrentPage == FinishedDeliveries)
        {
            await tabbedPageViewModel.InitializeAsync("FinishedDeliveries");
        }
    }

TabbedPageViewModel.cs

    public async Task InitializeAsync(object navigationData)
    {
        if (navigationData is string deliveryType)
        {
            if (deliveryType == "InProgress")
            {
                Deliveries = await _deliveryService.GetDeliveriesInProgress();
            }
            else if (deliveryType == "Finished")
            {
                Deliveries = await _deliveryService.GetFinishedDeliveries();
            }
        }
    }

什么是替代解決方案？

Answer 1

最好的方法是在視圖模型中使用兩個不同的屬性。 然后，您可以將選項卡中的兩個不同視圖綁定到關聯的屬性。

在您的視圖模型中：

public ObservableCollection<MyDeliveryModel> FinishedDeliveries;
public ObservableCollection<MyDeliveryModel> DeliveriesInProgress;

知道您可以添加兩種方法來加載這些屬性的數據：

public async Task RefreshFinishedAsync() 
{ 
    // Your logic to load the data from the service
}
public async Task RefreshInProgressAsync()
{ 
    // Your logic to load the data from the service
}

然后在您的TabbedPage-Event中：

if (CurrentPage == DeliveriesInProgress)
{
    await tabbedPageViewModel.RefreshInProgressAsync();
}
else if (CurrentPage == FinishedDeliveries)
{
    await tabbedPageViewModel.RefreshFinishedAsync();
}

使用此解決方案，您可以分離數據，並且每次更改選項卡時都不需要重新加載整個數據。 您可以檢查集合中是否已經有數據，如果有的話...只是不重新加載數據。 如果用戶需要，請執行此操作。

這改善了性能和用戶的“等待時間”。

或者作為替代方案：一次加載所有數據，然后僅過濾兩個collection-properties的數據。 這減少了服務呼叫。

Answer 2

您可以通過使用基礎視圖模型和使用基礎視圖的每個選項卡的視圖模型來完成此操作。 基地然后保存您的命令和交付。 您將每個選項卡式頁面綁定到該頁面的視圖模型，因此您無需檢查更改的選項卡。 構造每個視圖模型時，請傳遞基礎知識所需的信息以了解如何查詢數據。 對於每個選項卡式視圖，如果進行中和完成的視圖相同，請使用部分視圖並將其放在兩個選項卡式頁面中。 從長遠來看，這提供了靈活性。

public class InProgressDeliveriesViewModel: BaseDeliveryViewModel{

     public InProgressDeliveriesViewModel():base(filterParams){}
}

public class FinishedDeliveriesViewModel: BaseDeliveryViewModel{

     public FinishedDeliveriesViewModel():base(filterParams){}
}

public class BaseDeliveryViewModel{

   private FilterObjectOfSomeSort _filterParams;

   public BaseDeliveryViewModel(filterParams whatever){
      //use these params to filter for api calls, data.  If you are calling the same 
      //endpoint pass up the filter
      _filterParams = whatever;
    }

   public ObservableCollection<MyDeliveryModel> Deliveries {get;set;}

   public async Task LoadDeliveries(){
       //use the filter params to load correct data
       var deliveries = await apiClient.GetDeliveries(filterParams); //however you 
       //are gathering data
   }

.... All of your other commands

}