时间戳

首页 > 解决方案 > 将 IndexedDB 数据迁移到 JS 中的数组

javascript - 将 IndexedDB 数据迁移到 JS 中的数组

问题描述

我对 Web 开发比较陌生，目前正在尝试使用 vue.js 和 dexie.js 开发一个“离线”应用程序。Dexie.js 允许在现代浏览器索引数据库上更轻松地访问。

尽管如此，我相信我的问题更多是在基本的 javascript 方面。

我得到了这个基本的数据库（用 Dexie “增强”）：

var db = new Dexie("appDatabase");
db.version(1).stores({
   tasks: '++id,name, agi, str, vit, int',
   player: 'id, name, agi, str, vit, int',
});

（是的，只允许一名玩家）

..和编辑和添加数据到 indexedDB 工作得非常好...现在我正在尝试将数据从 IndexedDB 传输到一个数组，以便在 Vue.js 中更轻松地查看视觉效果（我选择 noneOf 是因为我不介意玩家离开名称为空）

        transferDBtoArray() {
            db.tasks.where('name').noneOf().toArray(function(result) {
                for(var i= 0; i< result.length; i++) {
                    app.tasks[i].id = result[i].id;
                    app.tasks[i].name = result[i].name;
                    app.tasks[i].str = result[i].str;
                    app.tasks[i].int = result[i].int;
                    app.tasks[i].vit = result[i].vit;
                    app.tasks[i].agi = result[i].agi;
                    
                }
            });

当这是我在 vue 应用程序中的数组结构时：

        tasks : [
            {id: 0, name:"", str: 0, agi: 0, int: 0, vit: 0}
        ],

可悲的是，它不会按预期工作：

Unhandled rejection: TypeError: Cannot set property 'name' of undefined

我知道从数据库访问数据工作正常：

        test() {
            db.tasks.where('name').noneOf().toArray(function(result) {
                for(var i= 0; i< result.length; i++) {
                    console.log( result[i].name);
                    console.log( result[i].agi);
                    console.log( result[i].str);
                    console.log( result[i].int);
                    console.log( result[i].vit);
                }
            });
        },


js.js:136 hüpfen
js.js:137 10
js.js:138 2
js.js:139 5
js.js:140 10
js.js:136 instagrammen
js.js:137 10
js.js:138 10
js.js:139 10
js.js:140 10
js.js:136 lollen
js.js:137 1
js.js:138 1
js.js:139 1
js.js:140 1
js.js:136 rennen
js.js:137 5
js.js:138 3
js.js:139 2
js.js:140

我猜我的错误是在数组的结构中，但我不确定..

任何帮助将不胜感激和亲切的问候

理查德

标签： javascriptarraysvue.jsdata-migrationdexie

解决方案

您需要app.tasks[i]在循环中每个赋值的开头设置一个空对象：

    transferDBtoArray() {
        db.tasks.where('name').noneOf().toArray(function(result) {
            for(var i= 0; i< result.length; i++) {
                app.tasks[i] = {};
                app.tasks[i].id = result[i].id;
                app.tasks[i].name = result[i].name;
                app.tasks[i].str = result[i].str;
                app.tasks[i].int = result[i].int;
                app.tasks[i].vit = result[i].vit;
                app.tasks[i].agi = result[i].agi;
                
            }
        });

或者更好：

transferDBtoArray() {
  db.tasks.where('name').noneOf().toArray(results => results.map(result => ({          
        id: result.id,
        name: result.name,
        str: result.str,
        int: result.int,
        vit: result.vit,
        agi: result.agi,
  })));

推荐阅读