2016-08-19 80 views
0

我正在使用ReactiveUI開始我的第一步,但我無法事件獲得一個非常基本的示例。只要屬性「SearchTerm」發生變化,我想執行任務。我遵循ReactiveUI(「一個引人注目的例子」)的github頁面上的說明。ReactiveUI:對一個屬性的更改作出反應

我有一個ViewModel與屬性SearchTerm綁定到我的視圖中的文本框。如果我更新TextBox的內容,則按預期更新屬性(我使用了UpdateSourceTrigger=PropertyChanged)。

的代碼在我的觀測永遠不會觸發:

public class MainWindowViewModel: ReactiveObject 
{ 
    public string SearchTerm 
    { 
     get { return m_SearchTerm; } 
     set { this.RaiseAndSetIfChanged(ref m_SearchTerm, value); } 
    } 

    private string m_SearchTerm; 

    public MainWindowViewModel() 
    { 
     SearchResults = new List<string>(); 

     var canSearch = this.WhenAny(x => x.SearchTerm, x => !string.IsNullOrWhiteSpace(x.GetValue())); 

     var search = ReactiveCommand.CreateAsyncTask(canSearch, 
       async _ => { 
        // this is never called 
        return await dosearch(this.SearchTerm); 
       }); 

      search.Subscribe(results => { 
       // this is never called too 
       SearchResults.Clear(); 
       SearchResults.AddRange(results); 
      }); 
     } 

     private async Task<List<string>> dosearch(string searchTerm) 
     { 
      await Task.Delay(1000); 

      return new List<string>() { "1", "2", "3" }; 
     } 

     public List<string> SearchResults { get; private set; } 
    } 

回答

1

您的命令中的代碼永遠不會觸發,因爲你不是調用命令的任何地方。您必須將您的命令綁定到任何事件(如輸入文本更改,按鈕單擊等)。

首先,從ViewModel暴露你的命令:

public ReactiveCommand<List<string>> Search { get; private set; } 

接下來,分配給它的構造函數:

this.Search = ReactiveCommand.CreateAsyncTask(canSearch, 
       async _ => { 
        return await dosearch(this.SearchTerm); 
       }); 

最後,調用命令時輸入的變化(這是關鍵缺少部分代碼):

this.WhenAnyValue(x => x.SearchTerm) 
    .InvokeCommand(this, x => x.Search); 

將上面的代碼放在構造函數中。

請注意,這會在用戶輸入時不斷觸發搜索。要解決這個問題,您可以使用名爲Throttleas seen in the example you linked to的Rx運算符。

+0

太棒了!謝謝。 –

相關問題