<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
button {
background-color: aqua;
min-width: 100px;
height: 50px;
}
</style>
<script src="../../dist/index.js"></script>
</head>
<body>
this is index.html
<button id="add">add</button>
<button id="delete">delete</button>
<button id="deleteDataBase">deleteDataBase</button>
<button id="deleteObjectStore">deleteObjectStore</button>
<button id="update">update</button>
<button id="get">get</button>
<button id="getAll">getAll</button>
<button id="findByIndex">findByIndex</button>
<script>
let scheme1 = [{
storeName: 'person13',
data: [{
id: 1,
name: 'wcx1',
age: 29,
email: 'wcx@qq.com'
}]
}, {
storeName: 'person14',
data: [{
id: 2,
name: 'wcx2',
age: 29,
email: 'wcx@qq.com'
}]
}]
let scheme2 = [{
storeName: 'person3',
_id: 1,
data: [{
id: 1,
name: 'wcx1',
age: 29,
email: 'wcx@qq.com'
}]
}, {
storeName: 'person4',
_id: 2,
data: [{
id: 2,
name: 'wcx2',
age: 29,
email: 'wcx@qq.com'
}]
}]
let idArr = [{
storeName: scheme1[0].storeName,
id: scheme1[0].data[0].id
}, {
storeName: scheme1[1].storeName,
id: scheme1[1].data[0].id
}];
let storeNames = [scheme1[0].storeName, scheme1[1].storeName]
document.querySelector("#add").addEventListener('click', async function() {
let indexDB = new myFirstIndexDB();
await indexDB.open(scheme1, 'myFirstIndexDB', 22);
await indexDB.add(scheme1).then(v => {
console.log('add', v)
}).catch(e => {
console.log('err', e)
})
})
document.querySelector("#get").addEventListener('click', async function() {
let indexDB = new myFirstIndexDB();
await indexDB.open(scheme1, 'myFirstIndexDB', 22);
await indexDB.read(idArr).then(v => {
console.log('get', v)
});
})
document.querySelector("#getAll").addEventListener('click', async function() {
let indexDB = new myFirstIndexDB();
await indexDB.open(scheme1, 'myFirstIndexDB', 22);
await indexDB.readAll(storeNames).then(v => {
console.log('所有的数据', v)
});
})
document.querySelector("#update").addEventListener('click', async function() {
let indexDB = new myFirstIndexDB();
await indexDB.open(scheme1, 'myFirstIndexDB', 22);
await indexDB.update(scheme1[0].storeName, {
id: 1,
name: 'wc',
age: 29,
email: 'wcx@qq.com'
}).then(v => {
console.log('update', v)
})
})
document.querySelector("#delete").addEventListener('click', async function() {
let indexDB = new myFirstIndexDB();
await indexDB.open(scheme1, 'myFirstIndexDB', 22);
await indexDB.delete(scheme1[0].storeName, 1)
})
document.querySelector("#deleteDataBase").addEventListener('click', async function() {
let indexDB = new myFirstIndexDB();
await indexDB.deleteDataBase('myFirstIndexDB').then(v => {
console.log('删除数据库成功', v)
}).catch(e => {
console.log('删除数据库失败', e)
})
})
document.querySelector("#deleteObjectStore").addEventListener('click', async function() {
let indexDB = new myFirstIndexDB();
await indexDB.open(scheme1, 'myFirstIndexDB', 22).then(v => {
console.log('数据库打开成功')
}).catch(e => {
console.log('数据库打开失败', e)
});
await indexDB.deleteObjectStore(scheme1[0].storeName).then(v => {
console.log('删除仓库成功', v)
}).catch(e => {
console.log('删除仓库失败', e)
})
})
document.querySelector("#findByIndex").addEventListener('click', async function() {
let indexDB = new myFirstIndexDB();
await indexDB.open(scheme1, 'myFirstIndexDB', 22).then(v => {
console.log('数据库打开成功')
}).catch(e => {
console.log('数据库打开失败', e)
});
await indexDB.findByIndex(scheme1[0].storeName, 'name', 'wc').then(v => {
console.log('查询成功', v)
})
})
</script>
</body>
</html>