vue.js - Dexie.js table.name 不起作用,即使该表位于 tables 属性下

标签 vue.js dexie

我想将表中的所有项目提取到集合中,但收到表名称为 undefined 的错误。这是我的商店:

db.version(1).stores({
  users: '++id,',
  orgs: '++id,',
  applications: '++id'
})

然后这是我的电话:

db.orgs.toCollection().count(function (count) {
   console.log(count)
})

它给出了以下错误:

TypeError: Cannot read property 'toCollection' of undefined

但是当我在调用时停止调试器并输入 db.tables 果然:

1:Table {name: "orgs", schema: TableSchema, _tx: undefined, …}
_tx:undefined
hook:function rv(eventName, subscriber) { … }
name:"orgs"

感谢任何帮助 - 谢谢。

更新

我注意到,当我在初始创建时为数据库播种时,我可以提取数据。所以我将该代码复制到我的模板中。但是它仍然失败,所以我一定缺少一些简单的东西,这是代码:

import Dexie from '@/dexie.es.js'

export default {
  name: 'ListOrgs',
  data: () => {
    return {
      orgs: []
    }
  },
  methods: {
    populateOrgs: async function () {
      let db = await new Dexie('myDatabase').open()
      db.orgs.toCollection().count(function (count) {
        console.log(count)
      })
    }
  },
  mounted () {
    this.populateOrgs()
  }
}

最佳答案

Dexie有两种模式

  • 静态 - 大多数样本中最常用的一种。
  • 动态 - 架构未在代码中指定。

静态模式

//
// Static Mode
//
const db = new Dexie('myDatabase');
db.version(1).stores({myTable1: '++'});
db.version(2).stores({myTable1: '++, foo'});
db.myTable1.add({foo: 'bar'}); // OK - dexie knows about myTable1!

动态模式

//
// Dynamic Mode
//
const db = new Dexie('myDatabase');
// FAIL: db.myTable1.add({foo: 'bar'}); // myTable1 is unknown to the API.
// Here, you must wait for db to open, and then access tables using db.table() method:
db.open().then(db => {
  const myTable = db.table('myTable');
  if (myTable) {
    myTable.add({foo: 'bar'});
  }
}).catch(error => {
  console.error(error);
});

如果省略任何 version() 规范,Dexie 将尝试打开任何具有相同名称的现有数据库,无论版本或模式如何。但它不会在数据库实例上创建隐式表属性。

动态模式何时有用

动态模式在构建适用于任何索引数据库的任意数据库实用程序(例如数据库浏览器)时非常有用。当 javascript 代码在设计上不知道架构(预期查询哪些表以及有哪些索引)时,动态模式也很有用。

静态模式的好处

  • 无需等待 db.open() 完成。
  • 在需要时自动创建数据库。没有复杂的应用代码来处理数据库版本控制。
  • 自动 DB population需要时。

静态模式下的设计模式

db.js

import Dexie from 'dexie';

//
// Let this module do several things:
//
//  * Create the singleton Dexie instance for your application.
//  * Declare it's schema (and version history / migrations)
//  * (Populate default data http://dexie.org/docs/Dexie/Dexie.on.populate)
// 

export const db = new Dexie('myDatabase');

db.version(1).stores({
  users: '++id,',
  orgs: '++id,',
  applications: '++id'
});

db.on('populate', () => {
  return db.orgs.bulkAdd([
    {'foo': 'bar'},
  ]);
});

app.js

import {db} from './db';

// Wherever you use the database, include your own db module
// instead of creating a new Dexie(). This way your code will
// always make sure to create or upgrade your database whichever
// of your modules that comes first in accessing the database.
//
// You will not have to take care of creation or upgrading scenarios.
//
// Let Dexie do that for you instead.
// 

async function countOrgs() {
  return await db.orgs.count();
}

关于vue.js - Dexie.js table.name 不起作用,即使该表位于 tables 属性下,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51254257/

相关文章:

vue.js - v-bind :css ="false" do, 到底是什么,它记录在哪里?

vue.js - 带 Mux 的 Video.js 无法播放视频

javascript - 我应该如何计算 IndexedDB 数据库中多个表的总销售额?

php - 实时同步MySql和IndexedDB

vue.js - 如何在 laravel 和 vue.js 中显示用户名而不是 id(外键)

laravel 419(未知状态)

vue.js - Vee 验证 - [Vue 警告] : Failed to resolve directive: validate

updates - 使用 Dexie,如何从表中所有对象的数组字段中删除值?

javascript - 将第二个查询的结果添加到第一个查询的答案

javascript - Dexie:两个日期之间的事件