.NET MAUI迁移时CommunityToolkit StateContainer报None状态未定义错误

问题原因 #

CommunityToolkit.Maui的StateContainer默认初始状态为None。你的代码中，登录界面的Grid作为StackLayout（StateContainer宿主）的直接子元素，理论上应自动关联为None状态的视图，但报错说明StateContainer无法匹配到该状态视图，核心原因是ViewModel的CurrentState初始值不是None/null，或状态绑定逻辑出现冲突。

解决方案 #

方案1：显式定义None状态视图 #

将默认登录界面的Grid移入StateContainer.StateViews，并显式标记为None状态：

<StackLayout
    Padding="0"
    HorizontalOptions="FillAndExpand"
    VerticalOptions="FillAndExpand"
    xct:StateContainer.CurrentState="{Binding CurrentState}">
    <xct:StateContainer.StateViews>
        <common:ErrorView
                VerticalOptions="FillAndExpand"
                xct:StateContainer.CurrentState="Error"></common:ErrorView>
        <common:LoadingView
                VerticalOptions="FillAndExpand"
                xct:StateContainer.CurrentState="Loading"
                LoadingText="Logging in"></common:LoadingView>
        <!-- 将原Grid移入此处，标记为None状态 -->
        <Grid
                xct:StateContainer.CurrentState="None"
                HorizontalOptions="FillAndExpand"
                VerticalOptions="FillAndExpand"
                BackgroundColor="{AppThemeBinding Light={StaticResource DayBackgroundColor}, Dark={StaticResource NightBackgroundColor}}"
                RowDefinitions="*, auto, auto, auto">
            <!-- 原Grid内元素保持不变 -->
            <Image
                Grid.Row="0"
                Aspect="AspectFill"
                Source="authcollage.png"
                HorizontalOptions="EndAndExpand"
                Margin="0" />
            <Label
                Grid.Row="1"
                HorizontalTextAlignment="Center"
                Margin="30,20,30,10"
                Text="Manage your Ravelry stash&#x0a;and projects in one place"
                Style="{OnIdiom Phone={StaticResource Headline5_MulishBold}, Tablet={StaticResource Headline4_MulishBold}}"
                TextColor="{AppThemeBinding Light={StaticResource DayPrimaryDarkColor}, Dark={StaticResource NightPrimaryColor}}"/>
            <Label
                Grid.Row="2"
                HorizontalTextAlignment="Center"
                Margin="0,0,0,30"
                Style="{OnIdiom Phone={StaticResource Body1}, Tablet={StaticResource Headline5_Mulish}}"
                Text="Get started with the YarnCat app"
                TextColor="{AppThemeBinding Light={StaticResource DayOnSurfaceColor}, Dark={StaticResource NightOnSurfaceColor}}" />
            <Button
                Grid.Row="3"
                Command="{Binding AuthCommand}"
                Margin="0,0,0,30"
                HorizontalOptions="Center"
                AutomationProperties.HelpText="Connect your Ravelry account to use the app"
                Style="{x:StaticResource ProminentButtonStyle}"
                Text="LOGIN TO RAVELRY"
                VerticalOptions="End" />
        </Grid>
    </xct:StateContainer.StateViews>
</StackLayout>

方案2：自定义初始状态并绑定 #

1. 给默认的Grid添加自定义状态标记（比如Login）：

<Grid
    xct:StateContainer.CurrentState="Login"
    HorizontalOptions="FillAndExpand"
    VerticalOptions="FillAndExpand"
    BackgroundColor="{AppThemeBinding Light={StaticResource DayBackgroundColor}, Dark={StaticResource NightBackgroundColor}}"
    RowDefinitions="*, auto, auto, auto">
    <!-- 内容不变 -->
</Grid>

2. 在ViewModel中将CurrentState的初始值设为Login：

public string CurrentState { get; set; } = "Login";

此时StateContainer初始化时会直接加载Login状态对应的Grid，不会触发None状态的查找。

额外检查 #

确保你已在MauiProgram.cs中正确注册MAUI Community Toolkit：

var builder = MauiApp.CreateBuilder();
builder
    .UseMauiApp<App>()
    .UseMauiCommunityToolkit()
    // 其他配置代码...

内容的提问来源于stack exchange，提问作者Ciara K.