绑定变量未在Nativescript（JavaScript）中的函数中更新

Question

语境

我有一个页面，可以使用点击按钮时调用的功能将listview切换为可见/隐藏。

listview元素的visibility属性设置为

{{ showFixtures ? 'visible' : 'collapsed' }}

当我最初绑定页面时， showFixtures变量设置为false且listview被隐藏。 反转后，将listview 。 这证明了showFixtures变量是最初绑定的。

轻按按钮时，应该将showFixtures变量在true和false之间切换。 我可以点击按钮并调用该函数，然后查看页面变量是否已更改，但是listview元素不会变为可见/隐藏（取决于上下文）。

码

page.xml

<Page loaded="loaded">
    <!-- ... -->
<Label text="Toggle Fixtures" ontap="toggleFixtures"  />
    <ListView items="{{ fixturesList }}" visibility="{{ showFixtures ? 'visible' : 'collapsed' }}">
        <ListView.item>
            <GridLayout class="list-matches-ko" rows="30" columns="auto,*">
                <Label row="0" col="0" class="list-matches-ko-date" text="{{ koLabelDate }}" />
                <Label row="0" col="1" class="list-matches-ko-time" text="{{ koLabelTime }}" />
            </GridLayout>
        </ListView.item>
    </ListView>
    <!-- ... -->
</Page>

page.js

var observableModule = require("data/observable");
var pageData = new observableModule.Observable;

exports.loaded = loaded;
function loaded(args){
    page = args.object;
    pageData.showFixtures = false;
    page.bindingContext = pageData;
}

//...

exports.toggleFixtures = toggleFixtures;
function toggleFixtures(args){
    pageData.showFixtures = pageData.showFixtures ? false : true;
    console.log(args.object.bindingContext.showFixtures);
    console.log(page.bindingContext.showFixtures);
    console.log(pageData.showFixtures);
}

产量

轻按三次按钮后，控制台上的输出为：

JS: true
JS: true
JS: true
JS: false
JS: false
JS: false
JS: true
JS: true
JS: true

题

如何通过使用绑定变量使用此函数使listView元素可见/隐藏，为什么它不按现在的方式工作？

Answer 1

由于您使用的是可观察的普通本机脚本，请尝试以下操作

pagedata.set('showFixtures', YOUR TERNARY HERE)