从一个视图切换到另一个视图时，如何保持用户控件的 Textbox Text 属性的值？

Question

Learning C#, specifically WPF, and the MVVM framework. I'm creating a basic project that presents a MainWindow with a contentcontrol binding. Straightforward.

I have 2 views, each with a textbox. I have 2 buttons on the MainWindow, each allow me to toggle between views. However, when I enter data in a textbox, switch views, and come back, the data is gone. How can I persist that data to be consumed later?

Relevant code:

MainWindow.xaml

<Window x:Class="TestDataRetention.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:TestDataRetention"
        xmlns:views="clr-namespace:TestDataRetention.Views"
        xmlns:viewmodels="clr-namespace:TestDataRetention.ViewModels"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Window.Resources>
        <DataTemplate DataType="{x:Type viewmodels:View1ViewModel}">
            <views:View1View DataContext="{Binding}"/>
        </DataTemplate>
        <DataTemplate DataType="{x:Type viewmodels:View2ViewModel}">
            <views:View2View DataContext="{Binding}"/>
        </DataTemplate>
    </Window.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition Height="60"/>
        </Grid.RowDefinitions>
        <StackPanel Orientation="Horizontal" Grid.Row="1" HorizontalAlignment="Right">
            <Button x:Name="View1Button" Margin="10" Width="80" Content="View1" Click="View1Button_Click"/>
            <Button x:Name="View2Button" Margin="10" Width="80" Content="View2" Click="View2Button_Click"/>
        </StackPanel>
        <ContentControl x:Name="Content" Grid.Row="0" Content="{Binding}"/>
    </Grid>
</Window>

MainWindow.xaml.cs

using System.Windows;
using TestDataRetention.ViewModels;

namespace TestDataRetention
{
    
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void View1Button_Click(object sender, RoutedEventArgs e)
        {
            DataContext = new View1ViewModel();
        }

        private void View2Button_Click(object sender, RoutedEventArgs e)
        {
            DataContext = new View2ViewModel();
        }
    }
}

View1View.xaml

<UserControl x:Class="TestDataRetention.Views.View1View"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:TestDataRetention.Views"
             xmlns:vm="clr-namespace:TestDataRetention.ViewModels"
             mc:Ignorable="d" 
             FontSize="24"
             d:DesignHeight="450" d:DesignWidth="800">
    <UserControl.DataContext>
        <vm:View1ViewModel/>
    </UserControl.DataContext>
    <Grid Background="AliceBlue">
        <StackPanel>
            <Label HorizontalAlignment="Center" Content="Enter View1 Stuff"/>
            <TextBox x:Name="View1TextBox" Width="400" Height="50" Text="{Binding View1Words}" />
        </StackPanel>
    </Grid>
</UserControl>

View1View.xaml.cs

using System.Windows.Controls;
using TestDataRetention.ViewModels;

namespace TestDataRetention.Views
{
    public partial class View1View : UserControl
    {
        public View1View()
        {
            InitializeComponent();

            this.DataContext = new View1ViewModel();
        }
    }
}

View2 is obviously the same as View1 but with corresponding variables.

Answer 1

While there might also be a way to just have wpf cache it for you, you can just as easily save it properly and then have the input available at will.

Look here for two methods on how to:

How to save user inputed value in TextBox? (WPF, XAML)

Answer 2

At quick glance, you create new ViewModel each time your button is clicked, this will always create new ViewModel for your DataContext not using the original one.

Also this snippet from your code will create new ViewModel for your Control's DataContext regardless of the one the parent control has:

<UserControl.DataContext>
    <vm:View1ViewModel/>
</UserControl.DataContext>

And I am not sure how you use your DataTemplate here:

<DataTemplate DataType="{x:Type viewmodels:View1ViewModel}">
    <views:View1View DataContext="{Binding}"/>
</DataTemplate>
<DataTemplate DataType="{x:Type viewmodels:View2ViewModel}">
    <views:View2View DataContext="{Binding}"/>
</DataTemplate>

But generally, as a guidance for you to model your MVVM project, always keep in mind that XAML code is translated to C# while compiling. So when writing something like <vm:View1ViewModel/> you actually do new View1ViewModel() .

So for you to use the DataContext your control inherited from its parent, you just use <UserControl DataContext="{binding}" for your UserControl.

And for your button click, you have to keep a pointer for your previously created ViewModel and assign it to the DataContext when needed, I suggest you to create these ViewModels only when needed to minimize memory consumption in large applications, like:

private View1ViewModel m_View1VM = null;
private void View1Button_Click(object sender, RoutedEventArgs e)
{
    if (m_View1VM is null)
        m_View1VM = new View1ViewModel();
    this.DataContext = m_View1VM;
}