- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
用例? Firebase
有新产品 Firestore
, 启用 offlinePersistence
根据他们的文档。
https://firebase.google.com/docs/firestore/manage-data/enable-offline?authuser=0#listen_to_offline_data
我想测试一种情况,应用程序加载,但没有与 firebase 建立连接(想想具有 serviceworker 缓存静态 Assets 的 Progressive Web App),但没有连接到 Firebase 的网络。
我的代码看起来像
import React from "react";
import {fdb} from "../mainPage/constants";
// includeDocumentMetadataChanges to know when backend has written the local changes
// includeQueryMetadataChanges to know if changes come from cache using 'fromCache' property
// https://firebase.google.com/docs/firestore/manage-data/enable-offline?authuser=0#listen_to_offline_data
const queryOptions = {
includeDocumentMetadataChanges: true,
includeQueryMetadataChanges: true
};
const collectionName = "todos";
export default class ToDos extends React.Component {
constructor(props) {
super(props);
this.state = {
items: [],
textBox: "",
loading: true
}
}
componentWillMount() {
let unsubscribe = fdb.collection(collectionName)
.onSnapshot(queryOptions, function (querySnapshot) {
let items = [];
querySnapshot.forEach(function (doc) {
items.push(doc);
//console.log(" data: ", doc && doc.data());
});
this.setState({"items": items});
}.bind(this));
this.setState({"unsubscribe": unsubscribe});
}
componentWillUnmount() {
this.state.unsubscribe();
}
handleTextBoxChange = (event) => {
this.setState({textBox: event.target.value});
};
handleAddItem = () => {
fdb.collection(collectionName).add({
"title": this.state.textBox
}).then(function (docRef) {
//console.log("added " + docRef.id, docRef.get());
});
};
handleRemoveItem = (item) => {
console.log("Deleting: ", item.id);
item.ref.delete()
.then(function () {
console.log(item.id + " deleted successfully");
})
.catch(function(reason){
console.log(item.id + " failed to delete: ", reason);
})
};
render() {
return (
<div>
<div>
<input type="text" value={this.state.textBox} onChange={this.handleTextBoxChange}/>
<input type="submit" value="Add Item" onClick={this.handleAddItem}/>
</div>
<div>{this.state.items
.map((item, index) => <Item key={index}
item={item}
onDeleteClick={this.handleRemoveItem}/>)}</div>
</div>
)
}
}
const Item = ({item, onDeleteClick}) => {
let pendingWrite = item.metadata.hasPendingWrites ? "[PendingWrite]" : "[!PendingWrite]";
let source = item.metadata.fromCache ? "[Cache]" : "[Server]";
return <div>
<input type="button" value="delete" onClick={() => onDeleteClick(item)}/>
<span>{source + " " + pendingWrite + " " + item.data().title}</span>
</div>
};
最佳答案
关于google-chrome - Chrome 开发工具 : How to simulate offline for a particular domain than the entire network?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46747745/
如何将以下行分成 3 组,其中“美元”总和为 10。所有行都必须使用,且不得超过一次。 row|dollars 1|1 2|1 3|1 4|1 5|1 6|1 7|3 8|4 9|7 10|10 一个
我试图使用 JSoup 和 Java 来获取满足我的条件的特定标记后的定义列表(或任何标记)的内容。作为示例,我们假设我们有一个 html 文档,如下所示。 PageID: 2816; NS: 0;
我想编写一个应用程序来识别当前的变更集并标记它们。 我知道我们可以通过使用 hg identify 来获取变更集. 获得变更集后,有没有办法标记它? 谢谢 最佳答案 来自 documentation
当在一个元素上触发多个动画时,我如何监听特定的 animationend。在我的例子中,我设计了一个覆盖歌曲列表(包含 li's,当悬停在上面时会触发动画),当单击列表图标时会弹出。然而,问题不在于菜
我目前正在使用来自支持库 (https://developer.android.com/tools/support-library/features.html#v7-palette) 的 Palett
我已将TinyMCE设置为可与“管理”面板一起使用(按照Django Docs http://code.djangoproject.com/wiki/AddWYSIWYGEditor中的说明进行操作)
我通过调用 API 获得响应。就像这样。 [{"id":213132},{"id":241132},{"id":465413},{"id":546351},{"id":164854,"data":[{
我的 makefile 包含这些片段(以及其他片段): SRC = src OBJ = obj DEPS = $(wildcard $(SRC)/*.cpp) # ... all : $(BINARI
当另一个元素包含特定 ID 时,我试图获取一个 jQuery 条件来将类应用于该特定元素。这是我到目前为止所拥有的: $(document).ready(function() { if( $('.c
这个问题已经有答案了: Is floating point math broken? (33 个回答) 已关闭 7 年前。 我想要这样的值 -1,1.02,1.04,1.06,1.08 等...所以在
我正在为寻呼机使用 fragmentpageadapter,我想用新的一组值重新加载特定的 fragment 。 NotifyDataSetcanged 正在重新加载所有 fragment ,我也在使
我有一个名为“checkInGuestUsers”的表,其中有“checkInTime(DATETIME)、checkOutTime(DATETIME)、rooms(varchar)”等列 有特定用户
我正在使用 JMeter 进行负载测试我面临以下问题: 我有一个视频制作网站要测试,我想点击由多个用户创建和播放视频按钮。 最佳答案 本教程介绍了很多用户如何在jmeter中播放 Action ,必须
假设我有以下列表,其中只有字符串。 appliances = ['blender', 'microwave', 'oven', 'toaster'] 如何生成一个由列表组件的元素组成的新列表,该列表仅
我有一个字符串 (Python 2.7.3),它在 Django 中呈现为模板,但我认为这不是 Django 特有的。该字符串来自 docx 文件中的 document.xml 文件。我正在提取呈现它
我正在尝试抓取网站的特定部分 ( https://flightmath.com/from-CDG-to-BLR ),但我无法定位到我需要的元素。 下面是html部分 flight dis
我正在使用 Ubuntu 12。我试图在我的 Ubuntu 机器主目录中搜索单词“SymbolSetThree”。 为此我使用了 grep "SymbolSetThree" /home 简单的显示为
我如何才能获得特定“place_id”的所有图片?。当我检索特定位置的“位置”列表时,我只能访问一个特定的图像“PHOTO_REFERENCE”。。我想通过它的“Places_id”(更具体的搜索)来
我有一个 Student 表,其中包含如下列: | email (PK) | name | 我有一个书 table ,里面有这样的列: | bookid(PK) | title | 我有一个复制表,上
在serverless.yml中,部署配置文件是这样设置的 custom: defaultStage: dev profiles: dev: b***2_dev prod: b***2_pro
我是一名优秀的程序员,十分优秀!