Nativescript getViewById 不更新倒计时

Question

所以，我正在使用我在这个问题中询问的计时器作为倒计时：

计数器有效，所有这一切都是在我一直在使用 console.log 检查它是否有效时，是的，但我想让它出现在该应用程序用户的 xml 中查看。但计数不会在 xml 中更新。

视图代码如下：

<Page xmlns="http://schemas.nativescript.org/tns.xsd" loaded="pageLoaded" navigatedTo="navigatedTo" navigatingFrom="onNavigatingFrom" actionBarHidden="true">

    <DockLayout orientation="horizontal" horizontalAlignment="center" backgroundColor="black" color="white">
        <Label text="Time remaining: " dock="left" margin="5" />
        <Label id="timeCount" text="" loaded="pageLoaded"></Label>
    </DockLayout>    
</Page>

以及后面的js文件：

var time;
var timeKeep = vm.time;
var count = 0;

function timeCountDown () {
    time = vm.time--;                    //this is the value that i need
    console.log("i is " + time);
}  

countId = timer.setInterval(() => {
    timeCountDown();
    count += 1;
    if (count === timeKeep) {
        timer.clearInterval(countId);
        dialogs.alert({
            title: "Time Up!",
            message: "You did not finish the test in time.",
            okButtonText: "OK"
        });
        aemnavigation.goResults(vm.correct);
    }
}, 1000);  



//the two lines below is how i get it to show on the xml

TimeCountScore = page.getViewById("timeCount");
TimeCountScore.text = time;

时间值到达视图但未更新，值倒计时。我 console.log(time) 以确保它仍然有效。

Answer 1

你应该 data binding 继承 Observable class，当属性改变时它也会更新 XML。对于您的情况，如果您仍然想继续练习，可以将 label.text 放在间隔内以更新它：

TimeCountScore = page.getViewById("timeCount");

countId = timer.setInterval(() => {
    TimeCountScore.text = time;
}, 1000);

Nativescript getViewById 不更新倒计时

Nativescript getViewById not updating for count down

javascript

setinterval

countdown

nativescript