SQLite
是一款轻量级的数据库,SQLite
的第一个版本是2000年就发布了的,经过十多年的历练,显然SQLite
目前已经相当成熟。SQLite
最大的特点就是没有任何数据库服务器,无论是C
、java
、node.js
,只需要相应的驱动,就可以直接对数据库进行读写,速度是相当的快。这里我们通过SQLite3
实现对SQLite
的一些操作。SQLite3
非常小,轻量级,就几百K大小;不需要用户名,密码,直接就可以对数据库进行操作。
注:这里使用是配合Electron
。而且需要前端对数据库sql
语句有一定了解。
一、安装SQLite3
数据库
cnpm install sqlite3 --save
二、建立数据库链接
const sqlite3 = require('sqlite3').verbose(),
DB = new sqlite3.Database('data.db', {});
这里必须指定.db
文件位置,建议和这个js
文件放在一个目录,而后这个链接数据库的js
文件要在Electron
主进程js
文件里面调用。
// 关闭数据库链接
DB.close((err, res) => {
if (err) {
console.log('数据库链接关闭失败::');
console.log(err)
return;
}
console.log('数据库链接关闭成功::');
console.log(res)
})
三、操作数据库
run
方法
用法:run(sql,param,...],[callback])
,多用于新增、修改、删除等不需要返回数据的场景。
功能:运行指定参数的SQL
语句,完成之后调用回调函数,它不返回任何数据,在回调函数里面有一个参数,SQL
语句执行成功,则参数的值为null
,反之为一个错误的对象,它返回的是数据库的操作对象。在这个回调函数里面当中的this
,里面包含有lastId
(插入的ID)和change
(操作影响的行数,如果执行SQL
语句失败,则change
的值永远为0
)。all
方法
用法:all(sql,[param,...],[callback])
,多用于查询等需要返回数据的场景。
功能:运行指定参数的SQL
语句,完成过后调用回调函数。如果执行成功,则回调函数中的第一个参数为null
,第二个参数为查询的结果集,反之,则只有一个参数,且参数的值为一个错误的对象。基础操作示例
3.1. 创建数据表
const CREATE_TABLE_SQL = `CREATE TABLE IF NOT EXISTS user
(
id INTEGER PRIMARY KEY AUTOINCREMENT,
name VARCHAR(64),
age INTEGER
);`;
DB.run(CREATE_TABLE_SQL, (err, res) => {
if (err) {
console.log('创建表失败::');
console.log(err)
return;
}
console.log('创建表成功::');
console.log(res)
});
3.2. 新增数据
const _user_info = {
name: 'cuiht-' + Math.ceil(Math.random() * 100),
age: Math.ceil(Math.random() * 100)
}, TEST_INSERT_SQL = `INSERT INTO user (name, age) VALUES('${_user_info.name}','${_user_info.age}')`;
DB.all(TEST_INSERT_SQL, (err, res) => {
if (err) {
console.log('新增数据失败::');
console.log(err)
return;
}
console.log('新增数据成功::');
console.log(res)
});
3.3. 修改数据
const _user_info_u = {
name: 'cuiht-' + Math.ceil(Math.random() * 100),
age: Math.ceil(Math.random() * 100)
}, TEST_UPT_SQL = `UPDATE user
SET name = '${_user_info_u.name}', age = '${_user_info_u.age}'
WHERE id = '2'`;
DB.all(TEST_UPT_SQL, (err, res) => {
if (err) {
console.log('修改数据失败::');
console.log(err)
return;
}
console.log('修改数据成功::');
console.log(res)
});
3.4. 删除数据
const TEST_DEL_SQL = `DELETE FROM user WHERE id = '3'`;
DB.all(TEST_DEL_SQL, (err, res) => {
if (err) {
console.log('删除数据失败::');
console.log(err)
return;
}
console.log('删除数据成功::');
console.log(res)
});
3.5. 查询数据列表
const TEST_LIST_SQL = `SELECT * FROM user ORDER BY id DESC`;
DB.all(TEST_LIST_SQL, (err, res) => {
if (err) {
console.log('查询数据列表失败::');
console.log(err)
return;
}
console.log('查询数据列表成功::');
console.log(res)
});
3.6. 查询数据
const TEST_GET_SQL = `SELECT * FROM user WHERE id = '3'`;
DB.all(TEST_GET_SQL, (err, res) => {
if (err) {
console.log('查询数据失败::');
console.log(err)
return;
}
console.log('查询数据成功::');
console.log(res)
});
四、 使用案例
注:这里是在Electron
+vue
中的使用案例。
- 新建文件
src/DB/index.js
,同时在相同的目录新建data.db
文件。
/*
* @Author: cuiht
* @Date: 2022-04-22 18:31:27
* @LastEditors: cuiht
* @LastEditTime: 2022-04-25 17:28:13
* @Description: 数据库链接 及 数据库操作方法封装
*/
const { ipcMain } = require('electron'),
sqlite3 = require('sqlite3').verbose(),
DB = new sqlite3.Database('data.db', {});
export const DBserve = (arg) => {
return new Promise((resolve) => {
const { tableName = '', order = '', option = {} } = arg;
if (!tableName) {
return resolve({
code: 0,
msg: '未获取数据表名!'
})
}
if (!order) {
return resolve({
code: 0,
msg: '未获取到指令!'
})
}
switch (order) {
case 'insert':
const TEST_INSERT_SQL = `INSERT INTO ${tableName} (name, age) VALUES('${option.name}','${option.age}')`;
DB.all(TEST_INSERT_SQL, (err, data) => {
if (err) {
return resolve({
code: 0,
msg: err
})
}
return resolve({
code: 200,
msg: "新增成功!",
data,
})
});
break;
case 'find':
const TEST_LIST_SQL = `SELECT * FROM ${tableName} ORDER BY id DESC`;
DB.all(TEST_LIST_SQL, (err, data) => {
if (err) {
return resolve({
code: 0,
msg: err
})
}
return resolve({
code: 200,
msg: "查询列表成功!",
data,
})
});
break;
case 'findOne':
let findOne_str = '', findOne_i = 0;
for (const key in option) {
if (findOne_i > 0) {
findOne_str += ` and `;
}
findOne_str += `${key} = ${option[key]}`;
findOne_i++;
}
const TEST_GET_SQL = `SELECT * FROM ${tableName} WHERE ${findOne_str}`;
DB.all(TEST_GET_SQL, (err, data) => {
if (err) {
return resolve({
code: 0,
msg: err
})
}
return resolve({
code: 200,
msg: "查询成功!",
data,
})
});
break;
case 'update':
if (!option.id) {
return resolve({
code: 0,
msg: '未获取到id'
})
}
let update_str = '', update_i = 0;
for (const key in option) {
if (key!=='id') {
if (update_i > 0) {
update_str += `,`;
}
update_str += `${key} = '${option[key]}'`;
update_i++;
}
}
const TEST_UPT_SQL = `UPDATE ${tableName} SET ${update_str} WHERE id = ${option.id}`;
DB.all(TEST_UPT_SQL, (err, data) => {
if (err) {
return resolve({
code: 0,
msg: err
})
}
return resolve({
code: 200,
msg: "更新成功!",
data,
})
});
break;
case 'remove':
if (!option.id) {
return resolve({
code: 0,
msg: '未获取到id'
})
}
const TEST_DEL_SQL = `DELETE FROM ${tableName} WHERE id = ${option.id}`;
DB.all(TEST_DEL_SQL, (err, data) => {
if (err) {
return resolve({
code: 0,
msg: err
})
}
return resolve({
code: 200,
msg: "删除成功!",
data,
})
});
break;
default:
break;
}
})
};
export const DBrunSql = (sql) => {
return new Promise((resolve) => {
if (!sql) {
return resolve({
code: 0,
msg: '未获取到sql!'
})
}
DB.run(sql, (err, data) => {
if (err) {
return resolve({
code: 0,
msg: err
})
}
return resolve({
code: 200,
msg: 'sql执行成功!',
data
})
})
})
};
ipcMain.on('DBserve', (event, arg) => {
DBserve(arg).then(res => {
event.returnValue = res
})
});
ipcMain.on('DBrunSql', (event, arg) => {
DBrunSql(arg).then(res => {
event.returnValue = res
})
});
- 新建文件
public/ipcRenderer.js
。
window.ipcRenderer = require("electron").ipcRenderer;
- 修改
Electron
主进程js
文件。
// 引入数据库入口文件
import './DB'
// ... 其他代码
async function createWindow() {
const win = new BrowserWindow({
// ...
webPreferences: {
// ...
nodeIntegration: true,
contextIsolation: false,
preload: `${__static}/ipcRenderer.js`
// ...
},
// ...
})
// ...
}
// ... 其他代码
- 新建
src/network/dataServes.js
。
/*
* @Author: cuiht
* @Date: 2022-04-25 14:44:40
* @LastEditors: cuiht
* @LastEditTime: 2022-04-25 17:37:46
* @Description: 调用数据库方法封装
*/
// 创建数据表
const CREATE_TABLE_SQL = `CREATE TABLE IF NOT EXISTS users
(
id INTEGER PRIMARY KEY AUTOINCREMENT,
name VARCHAR(64),
age INTEGER
);`;
window.ipcRenderer.sendSync('DBrunSql', CREATE_TABLE_SQL)
const DBserve = ({ order = '', option = '' }) => {
return new Promise((resolve) => {
const res = window.ipcRenderer.sendSync('DBserve', {
tableName: 'users',
order,
option
})
resolve(res)
});
}
export const
// 新增记录
userAdd = data => DBserve({
order: 'insert',
option: {
...data,
createTime: new Date().getTime()
}
}),
// 查询记录列表
userList = data => DBserve({
order: 'find',
option: data
}),
// 查询记录
userGet = data => DBserve({
order: 'findOne',
option: data
}),
// 修改记录
userUpt = data => DBserve({
order: 'update',
option: data
}),
// 删除记录
userDel = data => DBserve({
order: 'remove',
option: data
});
- 新建一个
vue
页面。
<!--
* @Author: cuiht
* @Date: 2022-04-22 18:41:07
* @LastEditors: cuiht
* @LastEditTime: 2022-04-25 17:39:03
* @Description: 使用示例
-->
<template>
<div id="text-page">
<table class="list">
<tr>
<td><button @click="Add">新增</button></td>
</tr>
<tr v-for="item in list" :key="item.id">
<td>
{{ item }}
</td>
<td style="width: 150px">
<button @click="Upt(item)">修改</button>
<button @click="Del(item)">删除</button>
<button @click="Get(item)">查看</button>
</td>
</tr>
</table>
</div>
</template>
<script>
import {
userAdd,
userList,
userGet,
userUpt,
userDel,
} from "@/network/dataServes";
export default {
name: "test",
data() {
return {
list: [],
};
},
mounted() {
this.List();
},
methods: {
Add() {
const reqData = {
age: this.list.length + 1,
name: "cuiht-" + new Date().getTime(),
};
userAdd(reqData).then((res) => {
console.log(res);
if (res.code !== 200) {
return;
}
this.List();
});
},
List() {
userList().then((res) => {
console.log(res);
if (res.code !== 200) {
return;
}
this.list = res.data;
});
},
Get(item) {
userGet({
id: item.id,
}).then((res) => {
console.log(res);
if (res.code !== 200) {
return;
}
alert(JSON.stringify(res.data));
});
},
Upt(item) {
const reqData = {
id: item.id,
age: this.list.length + 1,
name: "undate-" + new Date().getTime(),
};
userUpt(reqData).then((res) => {
console.log(res);
if (res.code !== 200) {
return;
}
this.List();
});
},
Del(item) {
userDel({
id: item.id,
}).then((res) => {
console.log(res);
if (res.code !== 200) {
return;
}
this.List();
});
},
},
};
</script>
<style lang="scss">
#text-page {
width: 100vw;
height: 100vh;
position: fixed;
top: 0;
left: 0;
}
</style>
无论你将来想去哪里,想过怎样的生活,请现在就为自己蓄积能量。