我试图弄清楚如何执行在horizon.io集合中递增值的基本任务。例如,我有一个<h1>
标签可以代表一个upvotes按钮,我希望upvotes计数是持久的。
<h1 @click="inc">{{foo}}</h1> <!-- foo is local variable -->
<ul>
<li v-for="message in me">
{{message.value}} <!-- message.value is upvote value from collection -->
</li>
</ul>
然后在Vue实例中:
created() {
me.store({
datetime: new Date(),
value: this.foo // local data variable set to 0 initially.
}).subscribe(
result => console.log(result),
error => console.log(error)
)
var self = this
me.watch().subscribe(function(data){
data.map(function(data){
self.foo = data.value
})
})
},
然后,我每次点击<h1>
标记时都会尝试更新该值:
inc(){
me.update({
id: 1,
value: this.foo++
})
}
如何更新集合中的值,是否必须在模板中呈现集合才能访问集合中的值?
答案 0 :(得分:1)
首先,只需使用新的arrow function syntax即可避免var self = this
头痛。即使在函数函数内,this
仍将使用最外层的this
:
created() {
me.store({
datetime: new Date(),
value: this.foo // local data variable set to 0 initially.
}).subscribe(
result => console.log(result),
error => console.log(error)
);
me.watch().subscribe((data) => {
data.map((data) => {
this.foo = data.value;
})
})
},
您的增量.update
功能看起来是正确的,但我会这样做:
inc(){
this.foo++;
me.update({
id: 1,
value: this.foo
});
}
修复后和预修复可能会变得棘手,我不确定它是否会产生您期望的输出,因为它会return the value of this.foo
and then increment。
如何更新集合中的值,是否必须在模板中呈现集合才能访问集合中的值?
如果我正确理解了这个问题,那么您正确使用.update
,这样您就知道了!但根据我在Vue中的经验,您不必渲染集合才能访问该值?每次this.foo
的文档发生更改时,id: 1
都会被重新分配。但是,如果您最初id
某个对象时未提供.store
,我们将为该文档提供一个。{1}}。因此,您的初始.store
代码应该如下所示:
尝试{
me.insert({
id:1,
datetime:new Date(),
value:this.foo //本地数据变量最初设置为0。
})。订阅(
result =&gt;的console.log(结果),
错误=&gt;执行console.log(错误)
);
} catch(e){
console.log(“已经存在!”,e);
}
此外,您只想订阅对该id: 1
个文档的更改:
me.find(1).watch()。subscribe((data)=&gt; { data.map((data)=&gt; { this.foo = data.value; }); });
这会回答你的问题吗?
编辑:忘了,改变.watch
EDIT2:将.store
(每次都覆盖数据)更改为.insert
,如果文档不存在则会插入,如果文档不存在则会更新。我们想要这个功能,因为我们只想插入它,如果它不存在则不做任何操作,而不是覆盖value
字段。