NativeScript ListView itemTap 不会清空项目答案

【问题标题】：NativeScript ListView itemTap won't empty itemsNativeScript ListView itemTap 不会清空项目
【发布时间】：2015-11-07 23:54:45
【问题描述】：

作为我正在构建的 NativeScript iOS/Android 应用程序的一部分，我需要：
1. 搜索项目列表
2. 选择其中一个搜索结果
3.由于选择了一个，清除搜索结果

但它不起作用。奇怪的是，当附加到被清除的 SearchBar 时，相同的 clearItems 函数有效，只是在点击 ListView 中的项目时不起作用。

以下是相关代码：

XML

<Page>
    <AbsoluteLayout loaded="layoutLoaded">
        <SearchBar hint="Search for your opponent" id="search" submit="performSearch" />
        <ListView id="itemList" items="{{ itemList }}" visibility="{{ listVisible ? 'visible' : 'collapsed' }}">
            <ListView.itemTemplate>
                <WrapLayout>
                    <Image cssClass="itemImage" src="{{ image }}" />
                    <Label cssClass="itemLabel" text="{{ niceName }}" />
                </WrapLayout>
            </ListView.itemTemplate>
        </ListView>
    </AbsoluteLayout>
</Page>

JavaScript

function clearItems(thisLayout){
    thisLayout.bindingContext.itemList = [];
    thisLayout.bindingContext.listVisible = false;
}

exports.layoutLoaded = function(args){

    var thisLayout = args.object

    thisLayout.bindingContext = {
        itemList: [],
        listVisible: false
    };

    var searchBar = view.getViewById(thisLayout, 'search');

    searchBar.on(searchBarModule.SearchBar.clearEvent, function(args) {
        clearItems(args.object.parent);
    });

    var itemListWrap = view.getViewById(thisLayout, 'itemList');

    itemListWrap.on('itemTap', function(args){
        var page = args.object.parent;
        clearItems(page);
    });

}

非常感谢任何可以提供帮助的人。我认为列表项清除它自己的父列表会更复杂。

【问题讨论】：

我不完全理解你的问题，但有两件事。首先，将 bindingContext 绑定到一个可观察的对象/数组（参见 docs.nativescript.org/bindings.html 和 docs.nativescript.org/ApiReference/data/observable-array/… ）。秒，通过清空数组而不是重新定义它来清除列表，例如：while(itemList.length > 0) { itemList.pop(); }。这是一个解释如何使用可观察对象/数组的视频：youtu.be/MhwBpVRfljU?t=1402

标签： javascript android ios xml nativescript

【解决方案1】：

Emil 的建议最终为我解决了问题。

我改为使用可观察对象，这意味着当点击列表项时，我可以成功清空数组：

function clearItems(viewModel){
    while(viewModel.itemList.length > 0){
        viewModel.itemList.pop();
    }
    viewModel.set('listVisible', false);
}

var viewModel = new observableModule.Observable({
    listVisible: false,
    itemList: new observableArrayModule.ObservableArray([])
});

exports.layoutLoaded = function(args){

    var thisLayout = args.object

    thisLayout.bindingContext = viewModel;

    var searchBar = view.getViewById(thisLayout, 'search');

    searchBar.on(searchBarModule.SearchBar.clearEvent, function(args) {
        clearItems(viewModel);
    });

    var itemListWrap = view.getViewById(thisLayout, 'itemList');

    itemListWrap.on('itemTap', function(args){
        clearItems(viewModel);
    });

}

【讨论】：