WPF页面切换时嵌套TestPage消失的原因咨询

嘿，我一眼就看出问题所在了——WPF里任何一个UI元素（比如你那个静态的testPage实例）同一时间只能属于一个父容器，咱们一步步理清楚整个过程：

1. 第一次点Butt2切到CombinedPage时，Call()把testPage塞给了TimerFrame.Content，这时候testPage的父容器是TimerFrame，显示完全正常。
2. 当你点Butt1切回TestPage时，代码执行Main.Content = testPage——这一步会直接把testPage从TimerFrame的父容器里"拽"出来，重新绑定到Main这个Frame作为父容器。
3. 等你再点Butt2切回CombinedPage时，虽然调用了Call()想把testPage放回TimerFrame，但这时候testPage已经有Main这个父容器了，WPF绝对不允许一个UI元素同时属于两个父容器，所以TimerFrame自然就显示不出这个"有主"的testPage了。

方案1：每次用的时候新建TestPage实例（最简单，适合不需要保留状态的场景） #

如果你的TestPage不需要记住之前的操作状态，直接每次创建新实例就行，别复用那个静态的：

修改MainWindow.xaml.cs：

// 删掉静态的testPage实例，不用提前创建
// public static TestPage testPage = new TestPage();
public static CombinedPage combinedPage = new CombinedPage();

private void Butt1_Click(object sender, RoutedEventArgs e) {
    combinedPage.TimerFrame.Content = null;
    Main.Content = new TestPage(); // 每次点击都新建一个实例
}

private void Butt2_Click(object sender, RoutedEventArgs e) {
    Main.Content = null;
    combinedPage.Call();
    Main.Content = combinedPage;
}

再修改CombinedPage.xaml.cs的Call()方法：

public void Call() {
    TimerFrame.Content = new TestPage(); // 同样新建实例
}

方案2：用MVVM分离视图和数据（推荐，适合需要保留状态的场景） #

如果TestPage需要记住用户的操作状态（比如输入的内容、选中的选项），那最好用MVVM模式，把页面的数据和逻辑放到视图模型里，页面只负责展示：

1. 先写个TestViewModel类，把TestPage里需要的所有数据、命令都放进去。
2. 在TestPage.xaml里把DataContext绑定到TestViewModel的实例。
3. 之后不管是在MainFrame还是TimerFrame里显示TestPage，都新建一个TestPage实例，但绑定同一个TestViewModel对象——这样既避开了UI元素的父容器限制，又能保留所有状态。

方案3：用Frame的Navigate方法（适合导航场景） #

如果你用Frame是做页面导航用的，可以试试用Navigate方法代替直接赋值Content：

修改Butt1_Click：

private void Butt1_Click(object sender, RoutedEventArgs e) {
    combinedPage.TimerFrame.Navigate(null);
    Main.Navigate(MainWindow.testPage);
}

修改CombinedPage的Call()方法：

public void Call() {
    TimerFrame.Navigate(MainWindow.testPage);
}

不过要注意：如果还是复用同一个testPage实例，依然会有父容器的问题，所以要保留状态的话，还是优先方案2。

你这个问题就是WPF的UI元素树规则在搞事情——一个元素只能有一个父节点。选方案的时候看需求：不需要状态选方案1，要状态选方案2，导航场景可以试试方案3。

内容的提问来源于stack exchange，提问作者crackanddie