AutoSuggestBox (UWP) 在使用 Reactive 时通过代码隐藏绑定 UI

Question

Reactive UI 文档建议使用代码隐藏绑定而不是 XAML 绑定以避免内存泄漏。我正在尝试将视图模型中存在的 SearchCommand 绑定到 AutoSuggestBox.

SearchView.xaml

<AutoSuggestBox x:Name="SearchBox" QueryIcon="Find"/>

SearchView.xaml.cs

this.BindCommand(ViewModel,
    viewModel => viewModel.SearchCommand,
    view => view.SearchBox);

但是这不起作用，命令不会被调用。我也尝试绑定 QuerySubmitted 事件，但我在下面的 Events() 中找不到它。我用了 ReactiveUI.Events 包

SearchView.xaml.cs

this.Events().QuerySubmitted
    .InvokeCommand(this, x => x.ViewModel.SearchCommand)

Answer 1

我没有尝试直接绑定命令，但通常我绑定到属性然后监听变化。

this.Bind(ViewModel,
viewModel => viewModel.SearchTerm,
view => view.SearchBox);

然后在您的视图模型中

private string _searchTerm;

public string SearchTerm
{
    get => _searchTerm;
    set => this.RaiseAndSetIfChanged(ref _searchTerm, value);
}

然后在构造函数内部

this.WhenAnyValue(x => x.SearchTerm).Subscribe(_ => SearchCommand());

这没有经过测试，甚至可能不是最好的方法，但这就是我一直在做的

Answer 2

要访问 QuerySubmitted 事件，您需要执行 SearchBox.Events().QuerySubmitted。至于 BindCommand，您可能必须明确指定您希望命令绑定到哪个事件。您可以使用名为 toEvent 的可选字符串参数来做到这一点：nameof(SearchBox.QuerySubmitted)

AutoSuggestBox (UWP) 在使用 Reactive 时通过代码隐藏绑定 UI

AutoSuggestBox (UWP) binding through code behind when using Reactive UI

uwp

reactiveui