【问题标题】:Use search command of search bar on list view with mvvm pattern使用 mvvm 模式在列表视图上使用搜索栏的搜索命令
【发布时间】:2018-01-23 16:08:48
【问题描述】:

我是 xamarin mvvm 模式的初学者。目前我正在尝试创建一个搜索栏,从名称列表中搜索单词。我尝试在我的视图模型上编写一些关于 comman 函数的代码,并将其绑定到视图搜索栏的 SearchCommand 上。但它没有用。这是我的代码

namespace HelloWorld.ViewModel
{

    public class CustViewModel : INotifyPropertyChanged
    {

        private custmodel _custmodel;


        public custmodel custmodel
        {
            get { return _custmodel; }
            set
            {
                _custmodel = value;
                NotifyPropertyChanged();
            }
        }

        private string _message;
        public string message
        {
            get { return _message; }
            set
            {
                _message = value;
                NotifyPropertyChanged();
            }
        }

        private ObservableCollection<string> _list;
        public ObservableCollection<string> Items
        {
            get
            {
        return _list;
            }
            set
            {
                _list = value;
                NotifyPropertyChanged();
            }
        }

        public Command SaveCommand
        {
            get
            {
                return new Command(() =>
                {
                    message = "Your task : " + custmodel.name + ", " + custmodel.surname + " was successfully saved!";
                });
            }
        }

        private string _bar;

        public string Bar
        {
            get { return _bar; }
            set { _bar = value;
        }
    }

    public Command SearchCommand
{
    get
    {
            return new Command(() =>
            {
                string keyword = _bar;
                IEnumerable<String> searchresult = _list.Where(name => name.Contains(keyword));
                _list = new ObservableCollection<string>(searchresult);
                NotifyPropertyChanged();
            }
                );


    }
}

public CustViewModel()
{

    custmodel = new custmodel
    {
        name = "Aasish",
        surname = "Gurung",
        email = "iamaaceez@yahoo.com"
    };
    _list = new ObservableCollection<string>();
    _list.Add("Saurab");
    _list.Add("Basanta");
    _list.Add("Abhishek");
    _list.Add("Surace");
    _list.Add("Amir");

    }

    public event PropertyChangedEventHandler PropertyChanged;


    //public event PropertyChangedEventHandler PropertyChanged;

    private void NotifyPropertyChanged([CallerMemberName] String propertyName = "")
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }

    }
}

这是我的 xaml 文件

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         x:Class="HelloWorld.Styling"
         BackgroundColor="AntiqueWhite" Title="Hello"
         xmlns:converters="clr-namespace:HelloWorld.Converters; assembly=HelloWorld">

<StackLayout>
    <SearchBar x:Name="MainSearchBar" Text="{Binding Bar}"
               SearchCommand="{Binding SearchCommand}"/>
    <ListView ItemsSource="{Binding Items}"/>
</StackLayout>

【问题讨论】:

    标签: xamarin mvvm data-binding xamarin.forms


    【解决方案1】:

    首先,确保您将ContentPage 的BindingContext 设置为您的CustViewModel。

    此外,您应该停止向_list 分配和添加内容,而是向您的公共Items 属性分配和添加内容。 Items 是在分配给NotifyPropertyChanged() 方法时将触发它的那个。

    所以把你的SearchCommand改成这样:

    return new Command(() => {
        string keyword = _bar;
        IEnumerable<String> searchresult = _list.Where(name => name.Contains(keyword));
    
        Items = new ObservableCollection<string>(searchresult);
    
        //NotifyPropertyChanged(); //There is no reason to trigger NotifyPropertyChanged on this command each time the getter is run, I would image that this could cause an infinite loop
    });
    

    【讨论】:

    • 谢谢,感谢您的帮助。如果搜索栏上的文本为空,我想返回带有完整列表的列表视图。我该怎么做?
    • @AasishGrg 最好提出一个新问题,而不是在同一个帖子中提出多个问题,但是您必须保留一个单独的列表,其中包含所有项目,或者重新致电您的数据 API,如果有,请索要完整列表。
    猜你喜欢
    • 2015-10-05
    • 2019-11-25
    • 2021-11-28
    • 1970-01-01
    • 2019-02-19
    • 1970-01-01
    • 2011-12-15
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多