如何告诉鸡等待异步蛋数据库在聚合物中进行鸡功能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>
答案 0 :(得分:3)
简短回答?你等不及了。让你的代码简单地设置你的元素,这样如果还没有写任何东西,那么用户可见的状态是有意义的。然后只需更新一次&#34; egg&#34;已经完成了它的事情。如果该更新触发了计数器更新,则表示完全正常,并且您再次将其反映在用户可见状态中。
另外:可爱,因为它是为获得有用答案而命名的最差元素。由于它=)
,评论主题几乎完全脱轨