如何防止 firebase-query 元素更新数据
How to prevent firebase-query element to updating the data
我正在使用 polymer 和 firebase 创建一个网络应用程序。为了在数据库中获取列表,我使用了 polymerfire 的 "firebase-query" 元素。
现在,我从数据库中获取的项目列表是人们在我的应用程序上发布的帖子。现在我有了这样的 firebase-query 元素:
<firebase-query
id="query"
path="/posts"
limit-to-last="15"
data="{{posts}}">
</firebase-query>
我有 dom-repeat
模板标签来显示这样的帖子
<template is="dom-repeat" items="[[posts]]" as="post">
<div>[[post.content]]</div>
</template>
现在,如果我有一堆人同时发布很多内容,这个列表将每秒更新一次,而且很难阅读。
有没有办法防止 firebase-query
元素在初始加载完成后停止更新,并可能在我调用某个函数时再次更新?
我试图添加一个禁用属性,但这只会删除 data
属性(在我的例子中是 {{posts}}
)中的任何内容,所以当禁用设置时,屏幕上没有任何显示.
我不熟悉 firebase-query,但你可以做一些简单的技巧。在 属性 posts
上设置 observer
函数。
posts: {
Type: Array,
value: function(){return []},
observer: "debouncePosts"
}
然后在 js 中你可以定义 debounce 函数,我设置了例如 10 000 毫秒(10 秒)并调用了一些回调函数,我将 this.posts
设置为 currentPosts
属性 将在 template
中呈现。
debouncePosts: function(data) {
this.debounce("debouncePost", function(){
this.set("currentPosts", this.posts);
}.bind(this), 10000)
}
和 html 模板将类似于:
<template is="dom-repeat" items="[[currentPosts]]" as="post">
<div>[[post.content]]</div>
</template>
去抖文档:https://www.polymer-project.org/1.0/docs/api/Polymer.Base#method-debounce
如果你喜欢用不同的方式来做,比如每当用户按下更新时更新数据,现在对你来说真的很容易。只需在某个按钮上设置点击,然后在功能中你将执行类似 this.set("currentPosts", this.posts)
的操作
我正在使用 polymer 和 firebase 创建一个网络应用程序。为了在数据库中获取列表,我使用了 polymerfire 的 "firebase-query" 元素。
现在,我从数据库中获取的项目列表是人们在我的应用程序上发布的帖子。现在我有了这样的 firebase-query 元素:
<firebase-query
id="query"
path="/posts"
limit-to-last="15"
data="{{posts}}">
</firebase-query>
我有 dom-repeat
模板标签来显示这样的帖子
<template is="dom-repeat" items="[[posts]]" as="post">
<div>[[post.content]]</div>
</template>
现在,如果我有一堆人同时发布很多内容,这个列表将每秒更新一次,而且很难阅读。
有没有办法防止 firebase-query
元素在初始加载完成后停止更新,并可能在我调用某个函数时再次更新?
我试图添加一个禁用属性,但这只会删除 data
属性(在我的例子中是 {{posts}}
)中的任何内容,所以当禁用设置时,屏幕上没有任何显示.
我不熟悉 firebase-query,但你可以做一些简单的技巧。在 属性 posts
上设置 observer
函数。
posts: {
Type: Array,
value: function(){return []},
observer: "debouncePosts"
}
然后在 js 中你可以定义 debounce 函数,我设置了例如 10 000 毫秒(10 秒)并调用了一些回调函数,我将 this.posts
设置为 currentPosts
属性 将在 template
中呈现。
debouncePosts: function(data) {
this.debounce("debouncePost", function(){
this.set("currentPosts", this.posts);
}.bind(this), 10000)
}
和 html 模板将类似于:
<template is="dom-repeat" items="[[currentPosts]]" as="post">
<div>[[post.content]]</div>
</template>
去抖文档:https://www.polymer-project.org/1.0/docs/api/Polymer.Base#method-debounce
如果你喜欢用不同的方式来做,比如每当用户按下更新时更新数据,现在对你来说真的很容易。只需在某个按钮上设置点击,然后在功能中你将执行类似 this.set("currentPosts", this.posts)