如何在 Xamarin Forms 中將參數從一個頁面傳遞到另一個頁面？ 以及如何綁定視圖（頁面）及其ViewModel並初始化ViewModel object？

Question

如何在 Xamarin Forms 中將參數或對象從一個頁面傳遞到另一個頁面？ 我有一個包含一些對象的頁面，我想將它們傳遞到另一個頁面

如何在Xamarin Forms中綁定視圖（頁面）及其ViewModel並初始化ViewModel object？ 在 View 中初始化 ViewModel object 的正確方法是什么？

我一直在想如何在 Xamarin Forms 中實現這兩件事，最后，我想通了。 這兩個問題都可以一並回答。

Answer 1

推薦使用MVVM方法，它非常簡單。 請仔細閱讀，因為在 Xamarin Forms 中處理 UI 時，MVVM 非常重要

假設我們有 2 個接受用戶名的主頁主頁，在提交時我們導航到UserDetailsPage ，它顯示我們在上一頁輸入的用戶的詳細信息。 為簡單起見，我們將僅在UserDetailsPage上顯示用戶名，而不會顯示其他任何內容，以便我們了解如何使用 MVVM 方法將參數從一個頁面傳遞到另一個頁面。

所以從HomePage我想導航到UserDetailsPage 。

首頁.xaml

<Entry x:Name="nameEntryField" Placeholder="Enter your Name" />
<Button Text="Submit" Clicked="GoToUserDetailsPage" />

因此，在HomePage后面的代碼中，我們將有

private void GoToUserDetailsPage(object sender, EventArgs e)
{
    UserDetailsViewModel userDetailsViewModel = new UserDetailsViewModel();
    userDetailsViewModel.Name = nameEntryField.Text;
    Navigation.PushAsync(new UserDetailsPage(userDetailsViewModel)); // pass ViewModel object to next page
}

對於此View頁面，我們將在ViewModels文件夾中創建一個ViewModel class 作為UserDetailsViewModel.cs

using System.ComponentModel;

namespace MyApplication.ViewModels
{
    public class UserDetailsViewModel : INotifyPropertyChanged
    {
        public string Name
        {
            get { return name; }
            set { name = value; OnPropertyChanged(nameof(Name)); }
        }

        string name;

        public event PropertyChangedEventHandler PropertyChanged;

        protected virtual void OnPropertyChanged(string propertyName)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}

現在我們將創建UserDetailsPage

public partial class UserDetailsPage : ContentPage
{
    UserDetailsViewModel ViewModel = new UserDetailsViewModel();

    public UserDetailsPage(UserDetailsViewModel viewModel) // get viewModel object that will be passed from previous page
    {
        InitializeComponent();
        ViewModel = viewModel; // Initialize ViewModel object of this class with ViewModel object that we got from previous page hence it can be used inside this Page.
        BindingContext = ViewModel;
        string name = ViewModel.Name; // We will get the name that was entered in previous page
    }
}

在UserDetailsPage的XAML中，我們還可以添加 Label 並通過綁定到 ViewModel 設置其文本屬性來顯示我們從上一頁獲得的名稱。 我們已經設置了BindingContext = ViewModel; 這個頁面在構造函數中。 只需像這樣添加Label

<Label Text="{Binding Name}" />

這將自動將 Label 文本設置為我們在上一頁中輸入的用戶名。

這樣，通過創建 ViewModel 並使用 MVVM 方法，我們可以傳遞自定義 class 的對象，即 Page 的 ViewModel class object。