【发布时间】:2017-02-03 08:52:17
【问题描述】:
我构建了一个包含多个选项卡的简单页面。每个选项卡都从 Firebase 加载文章的提要(集合/列表)并在页面上呈现卡片。在我尝试使用app-indexeddb-mirror 将访问过的提要保存到indexeddb 之前,一切都按我的意愿进行。
这就是我所做的:
<dom-module id="my-view1">
<template>
<style include="shared-styles">
</style>
<paper-tabs id="tabs"
attr-for-selected="value"
selected="{{selectedFeed}}"
scrollable>
<template is="dom-repeat"
items="[[feeds]]"
as="feed">
<paper-tab value="[[feed.key]]">[[feed.name]]</paper-tab>
</template>
</paper-tabs>
<firebase-query id="[[selectedFeed]]_feed"
app-name="myfirebaseapp"
path="/myfirebaseappdb/feed/[[selectedFeed]]"
data="{{articles}}">
</firebase-query>
<app-indexeddb-mirror
key="[[selectedFeed]]"
data="[[articles]]"
persisted-data="{{persistedArticles}}">
</app-indexeddb-mirror>
<template is="dom-repeat"
items="[[persistedArticles]]"
as="article">
<paper-card image="[[article.image]]" alt="image">
<div class="card-content">
<h1 class="card-text">[[article.title]]</h1>
<h4 class="card-text">[[article.abstract]]</h4>
</div>
</paper-card>
</template>
</template>
<script>
Polymer({
is: 'my-view1',
ready: function () {
this.feeds = [
{name: "Feed1", key: "feed1"},
{name: "Feed2", key: "feed2"},
{name: "Feed3", key: "feed3"},
{name: "Feed4", key: "feed4"}
];
}
});
</script>
我想要做的是将每个提要缓存到indexeddb 作为一个条目(提要名称作为键,数据作为值),这样它们就可以在应用离线时加载。这基本上就是app-indexeddb-mirror 的用途,对吧?
但是,我无法理解firebase-query 和app-indexeddb-mirror 之间的数据流,并且在切换标签时,我不断收到indexeddb 条目被覆盖/清空。
是不是我做的不对?谢谢。
【问题讨论】:
-
当
firebase-query中的数据发生变化时,app-indexeddb-mirror会缓存数据。这意味着当您切换选项卡时,数据会发生变化,因为firebase-query上的path会发生变化,这反过来又会导致app-indexeddb-mirror元素重新缓存数据。 -
我吸引了几个观察者来打印日志,它确实看起来像你说的@BenThomas。我仍然无法弄清楚如何以正确的方式做到这一点?你能解释一下吗?谢谢。
-
一旦selectedFeed改变了,是不是也马上改变了app-indexeddb-mirror的key(数据绑定是同步的)?在那种情况下,不应该清除/清空具有先前键的缓存吗?
-
是的,我原以为它会像你说的那样存储在不同的键上。也许这是一个错误?
标签: polymer firebase-realtime-database offline-caching firebase-polymer polymerfire