electron中使用本地數(shù)據(jù)庫的方法詳解
眾所周知,electron是可以開發(fā)桌面端的框架;既然如此 那我們有一些數(shù)據(jù)不想讓別人看到,只能在自己的電腦上展示時怎么辦呢?這個時候就可以用到本地數(shù)據(jù)庫;數(shù)據(jù)庫有很多的,今天我給大家介紹的是sqlite3;大家可以一起來學(xué)習(xí)學(xué)習(xí),卷起來,卷起來...
安裝sqlite3
yarn add sqlite3
創(chuàng)建文件
在src文件下創(chuàng)建sql文件
sql/index.js // 這是連接數(shù)據(jù)庫文件 sql/db.js // 這是創(chuàng)建db表格文件 sql/sql-api // 這是接口文件
連接數(shù)據(jù)庫
os.homedir()是獲取當(dāng)前用戶的主目錄路徑,然后將sql.db文件保存在主目錄路徑; 通俗的講就是保存到C盤里面。
原因是在熱更新的時候會將該項目下的文件全部替換掉,如果你數(shù)據(jù)庫db文件保存在該項目文件下的話也會被重置掉,所以才將數(shù)據(jù)庫保存在C盤。
如果想了解熱更新的話,請閱讀這篇文章前端使用electron+vue3+ts搭建一個桌面端應(yīng)用且可以熱更新
const sqlite3 = require('sqlite3').verbose() let db; // 連接數(shù)據(jù)庫 export default function conDb() { const os = require('os'); const homedir = os.homedir(); // 用于獲取當(dāng)前用戶的主目錄路徑 const users = homedir.replace(/\\/g,'\\\\'); // 替換絕對和相對路徑 if (!db || !db.open) { db = new sqlite3.Database(users+'\\sql.db'); // 保存地址文件 }; return db; }
創(chuàng)建db表格
創(chuàng)建的所有表格都需要放置到serialize方法里面,然后創(chuàng)建的字段根據(jù)sql語法自行創(chuàng)建即可
注意: 以下是test表格,你創(chuàng)建表格的時候替換這個名字即可,然后 ()
里面的字段表示你表格需要創(chuàng)建的字段名以及類型;最后是 ()
中的字段的最后一個不能打逗號,否則會報錯創(chuàng)建表格不成功
import conDb from './index'; let db; export function init () { db = conDb(); return new Promise((resolve,reject) => { db.serialize(() => { // 測試數(shù)據(jù)庫 db.run(`create table if not exists test ( id INTEGER PRIMARY KEY AUTOINCREMENT NOT NULL, buyerType varchar(64) DEFAULT '1', tel int, cookie varchar(2000), uin varchar(1000) DEFAULT null, uid varchar(1000) DEFAULT null, createdTimer int )`); resolve(); }) }) }
在main.js主文件
引入表格文件并創(chuàng)建表格數(shù)據(jù)
import { init } from '@/sql/db'; init();
增加數(shù)據(jù)接口
新建sql/sql-api/test.js文件;后面該表格的數(shù)據(jù)操作(獲取和刪除)都將在這個文件中寫;我這邊不太會寫接口的一些方式方法,所以大家借鑒一哈就行,畢竟我只是一個小前端,哈哈哈
大致講解以下代碼的意思:
db.all(inquire 查詢表格中是否有該用戶,如果有該用戶就不插入到表格中;反之插入表格;sql和inquire都是一些sql語法;sql是插入,inquire是查詢語法
import conDb from "../index"; export default { /** * 增加數(shù)據(jù) * @param {*} param0 * @returns */ addTest({type = 1, tel, cookie, uin}) { let db = conDb(); let createdTimer = new Date().getTime(); return new Promise((resolve, reject) => { let sql = `INSERT INTO test (type, tel, cookie, createdTimer, uin) `; sql += `values ("${type}", "${tel}", "${cookie}", "${createdTimer}", "${uin}")`; let inquire = `select * from test where tel = "${tel}"`; db.all(inquire,(err,list) => { // 查詢用戶 if (err) { reject({code:400,msg:err,data:[]}); }else { if (list.length) { // 有用戶 resolve({code:201,msg:'已有該用戶',data:list}) }else { // 沒有用戶 db.all(sql,(error,data) => { if (error) { reject({code:400,msg:error}); } else { resolve({code:200,msg:'成功',data}); } }); } } }) }) } }
使用效果
代碼:
testApi.addTest({ type:1, tel:'177****1111', cookie:'dsjadljsakldjsakldjkaslfklaj', }) .then(res=>{ console.log(res); })
效果1:
以下就是增加數(shù)據(jù)和重復(fù)數(shù)據(jù)的響應(yīng)效果
獲取數(shù)據(jù)列表
首先通過totalSql語法獲取test表格有多少條數(shù)據(jù),如果有附加條件也是可以where這個查找的;得到總數(shù)以后根據(jù)sql語法實現(xiàn)分頁效果
如果增加了tel電話號碼的話,也是可以搜索的
getTest({page = 1,pageSize = 10,tel = ''}) { let db = conDb(); // 獲取total語法 let totalSql = `select count(*) total from test`; let total = 0; return new Promise((resolve, reject) => { // 統(tǒng)計總數(shù) db.all(totalSql,(err,totalData)=>{ if(err) {reject({code:200,msg:err,data:'總計條數(shù)錯誤'})}; total = totalData[0].total; }); // 實現(xiàn)分頁語法 let sql = `select * from test`; if (tel) { sql += ` where tel = "${tel}"`; }; sql += ` limit ${(page - 1) * pageSize},${pageSize}`; db.all(sql,(error,data) => { if (error) { reject({code:400,msg:error}); } else { resolve({code:200,msg:'成功',data}); } }); }) }
使用效果
代碼:
testApi.getTest({page:1}) .then(res=>{ console.log(res); })
效果2
刪除數(shù)據(jù)接口
delTest({id = 1}) { let sql = `DELETE FROM test WHERE id = ${id}`; let weightSql = `select * from test where id = ${id}`; return new Promise((resolve, reject) => { let db = conDb(); db.all(weightSql,(err,list)=>{ if (err) { reject({code:400,msg:err,data:[]}); } else { if (list.length) { db.all(sql,(error,data) => { if (error) { reject({code:400,msg:error}); } else { resolve({code:200,msg:'刪除成功',data:list}); } }); }else { resolve({code:400,msg:`買家號不存在`}); } } }); }) }
使用效果
代碼:
testApi.delTest({id:1}) .then(res=>{ console.log(res); })
效果3:
完成到這兒的時候,增刪查基本上就完成了;至于改的話,你們可以自己去研究研究,總體上來說都不難;百度sql語句即可;哈哈哈哈
注意 如果在啟動或者打包的時候報錯的話,有可能是sqlite3編譯錯誤了(我現(xiàn)在記不住報錯示列了,報錯的時候是一個大佬幫我編譯了一個依賴包;后來我科學(xué)上網(wǎng)以后就沒遇到過這個問題);所以大家在用sqlite3的時候,一般還是要科學(xué)上網(wǎng),否則可能會出現(xiàn)問題;也可能是py的一些環(huán)境需要在(我的3.x)的;其他的問題我就沒遇到過了(這個問題是去年剛使用的時候遇到的)
到此這篇關(guān)于electron中使用本地數(shù)據(jù)庫的方法詳解的文章就介紹到這了,更多相關(guān)electron使用本地數(shù)據(jù)庫內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
Vue實現(xiàn)自定義字段導(dǎo)出EXCEL的示例代碼
這篇文章主要介紹了Vue實現(xiàn)自定義字段導(dǎo)出EXCEL的示例代碼,代碼簡單易懂,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2022-08-08Vuex中mutations與actions的區(qū)別詳解
下面小編就為大家分享一篇Vuex中mutations與actions的區(qū)別詳解,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-03-03Vue3使用 createApp 自定義通用Dialog的方法
這篇文章主要介紹了Vue3使用 createApp 自定義通用Dialog的方法,本文給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友參考下吧2024-01-01vue.js移動端app之上拉加載以及下拉刷新實戰(zhàn)
這篇文章主要介紹了vue.js移動端app之上拉加載以及下拉刷新實戰(zhàn),非常具有實用價值,需要的朋友可以參考下2017-09-09vue?循環(huán)動態(tài)設(shè)置ref并獲取$refs方式
這篇文章主要介紹了vue?循環(huán)動態(tài)設(shè)置ref并獲取$refs方式,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2023-01-01