聚合物指数DB鸡蛋在鸡肉里
polymer indexedDB egg inside chicken
如何告诉鸡肉等待异步鸡蛋数据库在聚合物中执行鸡肉函数read()
?
这里我的loadChanged
不工作?
<polymer-element name="my-chicken">
<template>
<style>
p {font-family: 'RobotoDraft', sans-serif; padding:10px;}
</style>
<p>Loading...</p>
<my-egg iLoad="{{load}}" iDB="{{db}}"></my-egg>
</template>
<script>
Polymer('my-chicken', {
load:false,
db:null,
out:null,
write:function(){
this.db.result.transaction(["store"], "readwrite").objectStore("store");
var customerData = [
{muts: "Bill", qty: "1"},
{muts: "Donna", qty: "1"},
]
for (var i in customerData){db.put(customerData[i])}
},
remove:function(k){
this.db.result.transaction(["store"], "readwrite").objectStore("store");
db.delete(k)
},
read:function(tx){
var f =function(e) {
var cursor = e.currentTarget.result;
if (cursor) {
console.log(cursor.key)
var br=document.createElement('br')
var span=document.createElement('span')
span.innerHTML=cursor.key
span.onclick=function(){remove(cursor.key)}
this.out.appendChild(span)
this.out.appendChild(br)
cursor.continue()
}
}.bind(this)
this.out.innerHTML=""
var req = tx.openCursor()
req.onsuccess = f
console.log('hello')
},
ready:function(){
this.out=this.shadowRoot.querySelector('p')
}
loadChanged:function(){
console.log('hello')
var tx=this.db.result.transaction(["store"], "readwrite").objectStore("store");
this.read(tx)
}
})
</script>
</polymer-element>
<polymer-element name="my-egg" attributes="iDB iLoad">
<script>
Polymer('my-egg', {
iDB:null,
iLoad:false,
ready:function(){
var load=function(){
this.iLoad=true
console.log('iLoad',this.iLoad)
}.bind(this)
var request = indexedDB.open("my-database",1);
request.onupgradeneeded = function(e) {
var db = e.currentTarget.result
var store = db.createObjectStore("store", {keyPath: "muts", autoIncrement:false})
console.log('db upgrade', 'v'+db.version)
}
request.onerror = function(e) {
console.error('db error ',e)
}
request.onsuccess = function(e) {
var db = e.currentTarget.result
console.log('db setup', 'v'+db.version, 'OK')
load()
}
this.iDB=request
},
drop: function () {
this.iDB.result.close()
var req = indexedDB.deleteDatabase(this.iDB.result.name);
req.onsuccess = function() {console.log("Deleted database successfully")}
req.onerror = function() {console.log("Couldn't delete database")}
req.onblocked = function() {console.log("Couldn't delete database due to the operation being blocked")}
}
})
</script>
</polymer-element>
简短回答?你不需要等待。让您的代码简单地设置您的元素,这样,如果还没有编写任何内容,则用户可见的状态是有意义的。然后只要在你的"蛋"完成任务后更新它。如果该更新触发了计数器更新,那么这是完全可以的,并且您的用户可见状态再次反映了这一点。
此外:虽然很可爱,但为了得到有用的答案,这是最糟糕的元素命名。评论线程几乎完全偏离轨道,因为它=)
相关文章:
- 聚合物-dom重复的起始指数
- setInterval() 无法正常工作 - 呈指数级增长
- 来自模数和JavaScript中的私有指数的RSA私钥
- jQuery 将表导出到 Excel 以指数形式更改值
- 对负指数调用的.toFixed()返回一个数字,而不是字符串
- Z指数大于Fancybox
- 保持关键指数稳定
- angularjs美元指数发行
- 在Jquery中,通过追加函数以指数形式添加Div
- 什么's是指数RampToValueAtTime允许的最小浮点值
- 从2个点求解指数方程
- 如何降低iPad3 MP4播放器的z指数
- JS从字符串中提取指数
- 高图表系列 Z 指数
- 在 javascript 中用指数格式化数字
- drawImage(HTML5CanvasElement) Firefox 内存指数级增长
- Chardin.js绝对定位的z指数问题
- 语法错误:Javascript 中缺少指数
- Javascript函数保持指数级循环.为什么
- 聚合物指数DB鸡蛋在鸡肉里