首页 > 解决方案 > wasm 中的双向绑定

问题描述

我正在测试 Uno 平台和 wasm。

我测试了一个简单的数据绑定,其中在登录到 webapi 后我在文本框中有一个用户名我更新了用户名的属性以测试从 viewmodel 中的绑定属性更新 gui。

xml。

在登录按钮中

        var result = await webApiClient.LoginUser(ViewModel.LoginModel);
        ViewModel.LoginModel.Email = result.Model.Name;

如果我在 UWP 下运行该应用程序,它可以工作,在 wasm 下,文本框不会更新。

<Page
x:Class="DeviceExchange.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:DeviceExchange"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:ios="http://nventive.com/ios"
xmlns:wasm="http://nventive.com/wasm"
mc:Ignorable="d ios wasm">

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
        <TextBlock Grid.Row="1" Grid.Column="1" Text="Device Exchange 
 Portal" Margin="20" FontSize="30" />
     <TextBlock Grid.Row="2" Grid.Column="1" Text="username" Margin="3" 
 FontSize="15" />
     <TextBox Grid.Row="3" Grid.Column="1" Text="{x:Bind LoginModel.Email, 
 Mode=TwoWay}" Background="White" />
     <TextBlock Grid.Row="4" Grid.Column="1" Text="username" Margin="3" 
 FontSize="15" />
     <PasswordBox Grid.Row="5" Grid.Column="1" Password="{x:Bind 
LoginModel.Password, Mode=TwoWay}" Background="White"/>
     <Button Margin="0,5" Click="LoginButton_Click" 
VerticalAlignment="Center" HorizontalAlignment="Stretch" Grid.Row="6" 
Grid.Column="1" x:Name="LoginButton" Content="Login" />
 </Grid>
 </Page>

标签: uno-platform

解决方案


{x:Bind Mode=TwoWay}Uno 目前不支持。 https://github.com/unoplatform/uno/issues/2587

相反,您可以以这种方式编写它作为解决方法:

Text="{Binding LoginModel.Email, Mode=TwoWay, RelativeSource={RelativeSource Self}}"


推荐阅读