聚合物指数DB鸡蛋在鸡肉里

polymer indexedDB egg inside chicken

本文关键字:鸡蛋 指数 DB 聚合物      更新时间:2023-09-26

如何告诉鸡肉等待异步鸡蛋数据库在聚合物中执行鸡肉函数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>

简短回答?你不需要等待。让您的代码简单地设置您的元素,这样,如果还没有编写任何内容,则用户可见的状态是有意义的。然后只要在你的"蛋"完成任务后更新它。如果该更新触发了计数器更新,那么这是完全可以的,并且您的用户可见状态再次反映了这一点。

此外:虽然很可爱,但为了得到有用的答案,这是最糟糕的元素命名。评论线程几乎完全偏离轨道,因为它=)