vue indexedDB的使用

vue indexedDB的使用

    import Idb from 'idb-js'  //  引入Idb
    import db_student_config from './db_student_config' // 引入数据库配置
        methods: {
            
            getdev() {
                   Idb(db_student_config).then(devInfo => {
                       
                        // 樹形接口數據插入
                        devInfo.insert({
                            tableName: "park",
                            data: [       
                                { id: 1,  tree: info },
                                { id: 2,  maxid: id },
                            ] 
                        });
                        // 矩形框篩選用經緯度插入
                        devInfo.insert({
                           tableName: "lnglat",
                           data: this.deviceLngLat
                        });
                        // 将deviceIds表中,主键值为1的数据查询出来
                        devInfo.query({
                            tableName: "park",
                            condition: (item)=> { return item.id == 1},
                               success: data => {
                                  console.log(data)//查询结果打印
                               }
                         });
                    })
            },
        }


//  db_student_config.js  数据库配置
// in db_student_config.js

export default {
  dbName: 'devInfo', // 数据库名称
  version: 1, // 数据库版本号(默认为当前时间戳)
  tables: [ // 数据库的表,即ObjectStore
    {
      tableName: 'park', // 樹形結構表
      option: { keyPath: 'id' }, // 表配置,即ObjectStore配置,此处指明主键为id
      indexs: [ // 数据库索引(建议加上索引)
        {
          key: 'id', //  索引名
          option: { // 索引配置,此处表示该字段不允许重复
            unique: true
          }
        },
        {
          key: 'tree'
        }
      ]
    }
  ]
}

  

原文地址:https://www.cnblogs.com/luzt/p/14431689.html