gpt4 book ai didi

javascript - 当 Meteor 中的变量发生变化时,如何制作响应式 UI?

转载 作者:行者123 更新时间:2023-12-02 17:28:48 24 4
gpt4 key购买 nike

我不确定我是否了解如何让我的 Web 应用程序与 Meteor 保持 react 。

我有这个非常简单的模板

<body>
{{> simple}}
</body>

<template name="simple">
Counter: {{counter}} <br/>
<button>Increase</button>
</template>

和客户端脚本

var counter = 0;

Template.simple.counter = function () {
return counter;
}

Template.simple.events({
'click button': function () {
counter++;
console.log("counter is ", counter);
Meteor.flush();
}
});

单击按钮时,我可以在控制台中看到 counter 变量正在正确增加,但 UI 上没有任何反应。为什么?我认为这正是 Meteor.flush() 的目的。

最佳答案

UI 本身并不是响应式(Reactive)的,您需要使用 Meteor 的响应式(Reactive)项目之一。在这种情况下,您可能想要使用Session。尝试以下操作,而不是您粘贴的第二个脚本:

Session.set('counter', 0); // Initialize a *reactive* variable

Template.simple.counter = function () {
return Session.get('counter'); // This will automatically update, because Session is reactive
}

Template.simple.events({
'click button': function () {
Session.set('counter', Session.get('counter') + 1);
}
});

关于javascript - 当 Meteor 中的变量发生变化时,如何制作响应式 UI?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18432052/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com