How do I display an image in <Image> in WinUI 3?

Question

I am new to WinUI 3. I'm trying to display an image generated by QRCoder.But it failed and I don't what is wrong. I've tried many ways,but none of them make sense.

My code is mainly like this:

public LoginWindow()
{
    this.InitializeComponent();
    AppWindow.Resize(new Windows.Graphics.SizeInt32 { Width = 800, Height = 480 });
    ViewModel = new();
    ViewModel.GetQRCode();
}

public LoginVM ViewModel { get; set; }

xaml:

<Page xmlns:viewModels="using:proj1.Modules.Login.ViewModel">
    <Page.DataContext>
        <viewModels:LoginVM x:Name="LoginViewModel"/>
    </Page.DataContext>
    <Grid>
        <Image x:Name="ImageQRCode" Width="200" Height="200" Source="{Binding QrCodeImageSource}"/>
    </Grid>
</Page>

ViewModel:

[ObservableProperty]
private ImageSource _qrCodeImageSource;

public async void GetQRCode() {
    QrCodeImageSource = await LoadQRCodeImage();
}

private async Task<BitmapSource> LoadQRCodeImage()
{
        // (Generate QRCode from Url)
        Bitmap qrCodeBitmap = qrCode.GetGraphic(5);
        return Bitmap2BitmapImage(qrCodeBitmap);
    }
}