成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專(zhuān)欄INFORMATION COLUMN

關(guān)于indexedDB的使用,以及一個(gè)簡(jiǎn)單的封裝

Rindia / 2932人閱讀

摘要:因?yàn)閷?xiě)起來(lái)簡(jiǎn)潔,所以用寫(xiě)法來(lái)作說(shuō)明接口由提供,異步使用數(shù)據(jù)庫(kù)中的事件對(duì)象屬性。所有的讀取和寫(xiě)入數(shù)據(jù)均在中完成。由發(fā)起,通過(guò)來(lái)設(shè)置的模式例如是否只讀或讀寫(xiě),以及通過(guò)來(lái)獲得一個(gè)。

//因?yàn)镋S6寫(xiě)起來(lái)簡(jiǎn)潔,所以用ES6寫(xiě)法來(lái)作說(shuō)明
//IDBTransacation接口由IndexedDB API提供,異步transaction使用數(shù)據(jù)庫(kù)中的事件對(duì)象屬性。所有的讀取和寫(xiě)入數(shù)據(jù)均在transactions中完成。由IDBDatabase發(fā)起transaction,通過(guò)IDBTransaction 來(lái)設(shè)置transaction的模式(例如是否只讀或讀寫(xiě)),以及通過(guò)IDBObjectStore來(lái)獲得一個(gè)request。同時(shí)你也可以使用它來(lái)中止transactions。

let idxDB = {
    db: {},
    transaction: {},
    startTransaction() {
        //一個(gè)IDBTransacation只能使用一次
        //創(chuàng)建transaction有3個(gè)要求,一、有connection(數(shù)據(jù)庫(kù)連接),二、storeName(讀取的store名)、三、mode(包括readonly,readwrite和versionchange)
        this.transaction = this.db.transaction("diary", "readwrite");
        this.transaction.oncomplete = () => console.log("transaction complete");
        this.transaction.onerror = e => console.dir(e);
    },
    initDB() {
        //下面一行代碼,以數(shù)據(jù)庫(kù)名(danote)和版本號(hào)(1)為參數(shù),異步打開(kāi)一個(gè)數(shù)據(jù)庫(kù)
        let request = indexedDB.open("danote", 1);
        request.onerror = e => console.log(e.currentTarget.error.message);
        request.onsuccess = e => this.db = e.target.result;
        request.onupgradeneeded = e => {
            //如果之前數(shù)據(jù)庫(kù)不存在,也會(huì)運(yùn)行onupgradeneeded
            //新建objectStore
            let thisDB = e.target.result;
            if (!thisDB.objectStoreNames.contains("diary")) {
                let objStore = thisDB.createObjectStore("diary", {
                    keyPath: "id",
                    autoIncrement: true
                });
                //第一個(gè)參數(shù)是index名稱(chēng),第二個(gè)參數(shù)是keyPath
                objStore.createIndex("by_create_date", "create_date", {
                    unique: false
                });
            }
        };
    },
    closeDB() {
        //主動(dòng)close一個(gè)connection(其實(shí)沒(méi)什么意義,在被垃圾回收機(jī)制清除或創(chuàng)建上下文被destroy,connection會(huì)自動(dòng)close)
        db.close();
    },
    deleteDB() {
        indexedDB.deleteDatabase("danote");
    },
    addData(data, cb) {
        this.startTransaction();
        //Object Store是indexedDB的主要儲(chǔ)存機(jī)制
        //IDBTransaction.objectStore()返回你查詢(xún)的objectStore(IDBObjectStore對(duì)象)
        let objectStore = this.transaction.objectStore("diary");
        let request = objectStore.add(data);
        request.onsuccess = () => {
            if (cb) cb({
                error: 0,
                data: data
            })
        };
        request.onerror = () => {
            if (cb) cb({
                error: 1
            })
        };
    },
    clearObjectStore(id, cb) {
        this.startTransaction();
        let objectStore = this.transaction.objectStore("diary");
        let request = objectStore.clear();
        request.onsuccess = () => {
            if (cb) cb({
                error: 0,
                data: id
            });
        };
        request.onerror = () => {
            if (cb) cb({
                error: 1
            });
        };
    },
    addmData(mdata, cb) {
        this.startTransaction();
        let objectStore = this.transaction.objectStore("diary");
        for (let c = 0; c < mdata.length; c++) {
            let request = objectStore.add(mdata[c]);
            request.onerror = () => {
                if (cb) cb({
                    error: 1
                })
            }
        }
    },
    deleteData(id, cb) {
        this.startTransaction();
        let objectStore = this.transaction.objectStore("diary");
        let request = objectStore.delete(id);
        request.onsuccess = () => {
            if (cb) cb({
                error: 0,
                data: id
            })
        };
        request.onerror = () => {
            if (cb) cb({
                error: 1
            })
        }
    },
    getDataById(id, cb) {
        this.startTransaction();
        let objectStore = this.transaction.objectStore("diary");
        let request = objectStore.get(id);
        request.onsuccess = () => {
            if (cb) cb({
                error: 0,
                data: e.target.result
            })
        };
        request.onerror = () => {
            if (cb) cb({
                error: 1
            })
        }
    },
    getDataAll(cb) {
        this.startTransaction();
        let objectStore = this.transaction.objectStore("diary");
        let rowData = [];
        objectStore.openCursor(IDBKeyRange.lowerBound(0)).onsuccess = (e) => {
            let cursor = e.target.result;
            if (!cursor && cb) {
                cb({
                    error: 0,
                    data: rowData
                });
                return;
            }
            rowData.unshift(cursor.value);
            cursor.continue();
        };
    },
    updateData(id, updateData, cb) {
        this.startTransaction();
        let objectStore = this.transaction.objectStore("diary");
        let request = objectStore.get(id);
        request.onsuccess = e => {
            let thisDB = e.target.result;
            for (key in updateData) {
                thisDB[key] = updateData[key];
            }
            objectStore.put(thisDB);
            if (cb) cb({
                error: 0,
                data: thisDB
            })
        };
        request.onerror = e => {
            if (cb) cb({
                error: 1
            })
        }
    },
    getDataBySearch(keywords, cb) {
        this.startTransaction();
        let objectStore = this.transaction.objectStore("diary");
        let boundKeyRange = IDBKeyRange.only(keywords);
        let rowData = [];
        objectStore.index("folder").openCursor(boundKeyRange).onsuccess = e => {
            let cursor = e.target.result;
            if (!cursor) {
                if (cb) cb({
                    error: 0,
                    data: rowData
                })
                return;
            }
            rowData.push(cursor.value);
            cursor.continue();
        };
    },
    getDataByPager(start, end, cb) {
        this.startTransaction();
        let objectStore = transaction.objectStore("diary");
        let boundKeyRange = IDBKeyRange.bound(start, end, false, true);
        //關(guān)于keyRange https://www.w3.org/TR/IndexedDB/#dfn-key-range
        let rowData = [];
        objectStore.openCursor(boundKeyRange).onsuccess = e => {
            let cursor = e.target.result;
            if (!cursor && cb) {
                cb({
                    error: 0,
                    data: rowData
                });
                return;
            }
            rowData.push(cursor.value);
            cursor.continue();
        };
    }
}
//objectStore的名稱(chēng)在例子里全都寫(xiě)死了,因?yàn)槲抑唤艘粋€(gè)objectStore,使用時(shí)建議還是以參數(shù)傳進(jìn)函數(shù)

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/17595.html

相關(guān)文章

  • 關(guān)于indexedDB使用,以及一個(gè)簡(jiǎn)單封裝

    摘要:因?yàn)閷?xiě)起來(lái)簡(jiǎn)潔,所以用寫(xiě)法來(lái)作說(shuō)明接口由提供,異步使用數(shù)據(jù)庫(kù)中的事件對(duì)象屬性。所有的讀取和寫(xiě)入數(shù)據(jù)均在中完成。由發(fā)起,通過(guò)來(lái)設(shè)置的模式例如是否只讀或讀寫(xiě),以及通過(guò)來(lái)獲得一個(gè)。 //因?yàn)镋S6寫(xiě)起來(lái)簡(jiǎn)潔,所以用ES6寫(xiě)法來(lái)作說(shuō)明 //IDBTransacation接口由IndexedDB API提供,異步transaction使用數(shù)據(jù)庫(kù)中的事件對(duì)象屬性。所有的讀取和寫(xiě)入數(shù)據(jù)均在trans...

    Alliot 評(píng)論0 收藏0
  • indexedDB事務(wù)功能Promise化封裝(二)——利用generator完成同步化改造

    摘要:在不可以用的前提下,無(wú)論是同步化或者鏈?zhǔn)讲僮鞫加貌涣恕S谑亲蛱煳易约簩?shí)現(xiàn)了一個(gè)簡(jiǎn)單的同步執(zhí)行的,并以此為基礎(chǔ)實(shí)現(xiàn)了鏈?zhǔn)讲僮鳌? 前言 本來(lái)這個(gè)系列應(yīng)該不會(huì)這么快更新,然而昨晚寫(xiě)完前一篇后才發(fā)現(xiàn)我的思路中有一個(gè)巨大的漏洞。導(dǎo)致我在前一篇中花費(fèi)大量時(shí)間實(shí)現(xiàn)了一個(gè)復(fù)雜的Transaction類(lèi)——其實(shí)完全有更簡(jiǎn)單的方式來(lái)完成這一切。前篇:http://segmentfault.com/a/11...

    JackJiang 評(píng)論0 收藏0
  • 初探IndexedDB

    背景 隨著前端技術(shù)日新月異地快速發(fā)展,web應(yīng)用功能和體驗(yàn)也逐漸發(fā)展到可以和原生應(yīng)用媲美的程度,前端緩存技術(shù)的應(yīng)用對(duì)這起到了不可磨滅的貢獻(xiàn),因此想一探前端的緩存技術(shù),這篇文章主要會(huì)介紹在日常開(kāi)發(fā)中比較少接觸的IndexedDB IndexedDB 什么是IndexedDB IndexedDB簡(jiǎn)單理解就是前端數(shù)據(jù)庫(kù),提供了一種在用戶(hù)瀏覽器中持久存儲(chǔ)數(shù)據(jù)的方法,但是和前端關(guān)系型數(shù)據(jù)不同的是,Index...

    jsyzchen 評(píng)論0 收藏0
  • indexedDB事務(wù)功能Promise化封裝

    摘要:綜上,對(duì)進(jìn)行一定的封裝,來(lái)簡(jiǎn)化編碼操作?;膰L試對(duì)于這種帶大量回調(diào)的,使用進(jìn)行異步化封裝是個(gè)好主意。因此包括在內(nèi)的所有異步方法都會(huì)強(qiáng)制中止當(dāng)前事務(wù)。這就決定了一個(gè)事務(wù)內(nèi)部的所有操作必須是同步完成的。目前只實(shí)現(xiàn)了和,其他的有待下一步工作。 前言 本文是介紹我在編寫(xiě)indexedDB封裝庫(kù)中誕生的一個(gè)副產(chǎn)品——如何讓indexedDB在支持鏈?zhǔn)秸{(diào)用的同時(shí),保持對(duì)事務(wù)的支持。項(xiàng)目地址:htt...

    zombieda 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<