This article is a complementary demo to the previous article

Uni-app uses sqLite database local cache

The first job

Lead-in encapsulatedsqlite.js Address portal

The source code

HTML

<template> <view> <view class="uni-divider uni-divider__content">Demo</view> < button@click ="openSQL"> <button @click="createTable"> createTable </button> <button @click="insertTableData"> add table data </button> <button @click="updateTableData"> </button> </button @click="deleteTableData"> </button> <button @click="closeSQL"> V - for = "(item, index) in listData" : the key = 'index' > < view > name: {{item. The name}} < / view > < view > content: {{item. The content}} < / view > Time: < view > {{item. Time}} < / view > < / view > < / view > < / template >Copy the code

js

<script> // import DB from "@/common/sqlite.js"; export default { data() { return { listData: [] }; }, onLoad() { this.openSQL(); }, methods: {openSQL() {let open = db.isopen (); Console. log(" database status ", open? "On" : "off "); if (! Open) {db.openSqLite (). Then (res => {this.showtoast (" database open "); }). Catch (error => {console.log(" database failed to start "); }); }}, // close database closeSQL() {let open = db.isopen (); If (open) {db.closesqLite ().then(res => {this.showtoast (" database closed "); }). Catch (error => {this.showtoast (" database failed to close "); }); CreateTable () {let open = db.isopen (); if (open) { this.openSQL(); let sql = '"id" INTEGER PRIMARY KEY AUTOINCREMENT,"name" text,"content" text,"time" text'; Db.createtable ("chat", SQL). Then (res => {this.showToast(" create chat succeeded "); }). Catch (error => {this.showtoast (" create table failed "); }); } else {this.showtoast (" database not open "); InsertTableData () {let open = db.isopen (); If (open) {let arr = [{name: 'xiaomin ', content: "hello"}, {name:' xiaomin ', content: "HI" } ] arr.map(item => { let time = this.formatDate(new Date().getTime()); let sql = `'${item.name}','${item.content}','${time}'`; let condition = "'name','content','time'"; Db.inserttabledata ("chat", SQL, Condition). Then (res => {this. this.selectTableData(); }). Catch (error => {console.log(" failed ", error); }); })} else {this.showtoast (" database not open "); SelectTableData () {let open = db.isopen (); Db.selecttabledata ("chat"). Then (res => {if (open) {db.selecttableData ("chat"). Console. log("contact table data ", res); this.listData = res; }). Catch (error => {console.log(" query failed ", error); }); } else {this.showtoast (" database not open "); UpdateTableData () {let open = db.isopen (); if (open) { let time = this.formatDate(new Date().getTime()); Let data = 'content =' I am modified ',time = '${time}' '; Db. updateTableData("chat", "data ", "name") db. updateTableData("chat"," data ", "name") Then (res => {this.showToast(" update chat succeeded "); this.selectTableData(); }). Catch (error => {console.log(" failed to modify ", error); }); } else {this.showtoast (" database not open "); }}, // deleteTableData deleteTableData() {let open = db.isopen (); DB. DeleteTableData ("chat", "name", Then (res => {this.showtoast (" delete table data successfully "); this.selectTableData(); }). Catch (error => {console.log(" delete failed ", error); }); } else {this.showtoast (" database not open "); Function (STR) {uni. ShowToast ({icon: "none", title: STR, mask: true}); }, // Date formatDate(data) {let now = new Date(data); var year = now.getFullYear(); Var month = now.getMonth() + 1 < 10? "0" + (now.getMonth() + 1) : now.getMonth() + 1; var date = now.getDate() < 10 ? "0" + now.getDate() : now.getDate(); var hour = now.getHours() < 10 ? "0" + now.getHours() : now.getHours(); var minute = now.getMinutes() < 10 ? "0" + now.getMinutes() : now.getMinutes(); var second = now.getSeconds() < 10 ? "0" + now.getSeconds() : now.getSeconds(); return ( year + "-" + month + "-" + date + " " + hour + ":" + minute + ":" + second ); }}}; </script>Copy the code

This is their own small demo, what mistakes can be pointed out to learn together, common progress.

Have not understood can see this article first