如何通过单击主页中的按钮将数据从第二页传输到第三页

Posted 2023-04-13

【中文标题】如何通过单击主页中的按钮将数据从第二页传输到第三页

【英文标题】：how to transfer data from a second page to a third page from the button click in mainpage

【发布时间】：2020-12-02 11:25:03

【问题描述】：

我正在尝试创建一个具有 主页面 的应用程序，该页面有 2 个按钮。

第一个按钮打开一个包含 2 个选择器的弹出页面，用户必须选择一些值，完成后返回主页面。 主页上的第二个按钮打开一个内容页面，该页面有 2 个标签，这些标签应该从弹出页面接收数据。所以它应该像一个最终报告页面。 如果有人可以为我提供一个更适合使用 MVVM 的简单代码，我将不胜感激。我已经创建了一个类似的应用程序，但将主页作为 MasterDetailPage 并且它运行良好，我现在唯一的问题是，我希望将主页作为内容页面而不是 masterdetailpage。我希望我写的内容可以理解

主页xml

  <Button x:Name="board" Clicked="board_Clicked" Text="board Setup" />
<Button x:Name="lblFinalPage" Clicked="lblFinalPage_Clicked" Text="FinalPage" />

第二页

<Picker SelectedItem="Binding PICKER1" WidthRequest="120" FontSize="10" TextColor="Black" VerticalOptions="Center" BackgroundColor="WhiteSmoke">
                            <Picker.Items>
                                <x:String>15 cm</x:String>
                                <x:String>30 cm</x:String>
                                <x:String>45 cm</x:String>
                                <x:String>60 cm</x:String>
                                <
                            </Picker.Items>
                  </Picker>
                    

 <Picker  SelectedItem="Binding PICKER2" WidthRequest="120" FontSize="10" TextColor="Black" VerticalOptions="Center" BackgroundColor="WhiteSmoke">
                            <Picker.Items>
                                <x:String>Supine</x:String>
                                <x:String>Fst</x:String>
                            </Picker.Items>
                        </Picker>

第三页

 <Label Text="Binding piCKER1"></Label>
<Label Text="Binding piCKER2" ></Label>
                       

第二视图

 public secondview()
     
         SaveCommand = new Xamarin.Forms.Command(HandleAction);

     

     async void HandleAction(object obj)
     
         await ((App5.App)App.Current).MainPage.Navigation.PushAsync(
         new finalPage()
         
             BindingContext = new finalpageViewModel(PICKER1)
             
         );

     
     string picker1;
     public string PICKER1
     
         get
         
             return picker1;
         
         set
         
             if (value != picker1)
             
                 picker1 = value;
                 PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(PICKER1)));
             
         
     


     public ICommand SaveCommand
     
         get;
         set;
     

     public event PropertyChangedEventHandler PropertyChanged;
 

最后一页

   public finalpageViewModel(string pICKER1)
    
        piCKER1 = pICKER1;
    
    public string piCKER1
    
        get;
        set;
    

我在这里遇到的问题是，只有当我在第二页中有按钮时它才有效，然后我才能将数据传递到最后一页， 但我希望用户返回主页并执行其他操作，然后单击另一个按钮并导航到最后一页

【问题讨论】：

最简单的方法是让所有三个页面共享同一个虚拟机实例

【参考方案1】：

您可以创建一个DataModel模型类来存储字符串数据，并可以用来传递到第三页。

public class DataModel

    public string PICKER1  set; get; 
    public string PICKER2  set; get; 

    public DataModel()
    

    

然后在 MainPage 中，绑定此数据模型，并将 MainPage 的 BindingContext 传递到第二页或第三页。

public partial class PageMain : ContentPage

    public DataModel dataModel;
    public PageMain()
    
        InitializeComponent();
        dataModel = new DataModel();
        BindingContext = dataModel;
    

    private void Button_Clicked_Second(object sender, EventArgs e)
    
        Navigation.PushAsync(new PageSecond(BindingContext));
    

    private void Button_Clicked_Third(object sender, EventArgs e)
    
        Navigation.PushAsync(new PageFinal(BindingContext));
    

SecondPage需要绑定传递的BindingContext：

public partial class PageSecond : ContentPage

    public PageSecond(object bindingContext)
    
        InitializeComponent();
        BindingContext = bindingContext;
    

第三页也需要绑定传过来的BindingContext：

public partial class PageFinal : ContentPage

    public PageFinal(object bindingContext)
    
        InitializeComponent();
        BindingContext = bindingContext;
    

MainPage和SecondPage的Xaml代码不需要修改，ThirdPage需要修改修改其绑定名称Label文本，使其与DataModel保持一致：

<Label Text="Binding PICKER1"></Label>
<Label Text="Binding PICKER2" ></Label>

现在我们可以看到效果了：