0

0

React Native中使用Sqlite数据库的实例详解

零下一度

零下一度

发布时间:2017-06-24 14:35:13

|

3631人浏览过

|

来源于php中文网

原创

使用Sqllite可能用不同的环境创建出来的项目,比如说:用Expo创建的就可能和这个不一样!但是具体思路都是一样的,希望这篇文章可以帮助到大家!

1.安装

命令行进入到ReactNative项目根目录下执行

npm install React-native-sqlite-storage --save

 

2.进行全局Gradle设置
编辑 android/settings.gradle文件,添加以下内容
include ':react-native-sqlite-storage'
project(':react-native-sqlite-storage').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-sqlite-storage/src/android')
3.修改android/app/build.gradle文件

dependencies 里面添加  compile project(':react-native-sqlite-storage')


4.编辑MainApplication.Java文件,在MainActivitiy.java中注册sqlite模块

import org.pgsqlite.SQLitePluginPackage;

[java] view plain copy
  1. @Override  

  2.     protected List getPackages() {  

  3.       return Arrays.asList(  

  4.           new MainReactPackage(),  

  5.           new SQLitePluginPackage(),  

  6.           new BaiduMapPackage(getApplicationContext())  

  7.       );  

  8.     }  

截图如下:

5.使用

编写sqlite.js文件,引入组件     import SQLiteStorage from 'react-native-sqlite-storage';

注意每一个打印异常,不然可能看不到哪里出错了

[javascript] view plain copy
  1. import React,{Component} from 'react';  

  2. import{  

  3.   ToastAndroid,  

  4. } from 'react-native';  

  5. import SQLiteStorage from 'react-native-sqlite-storage';  

  6. SQLiteStorage.DEBUG(true);  

  7. var database_name = "test.db";//数据库文件  

  8. var database_version = "1.0";//版本号  

  9. var database_displayname = "MySQLite";  

  10. var database_size = -1;//-1应该是表示无限制  

  11. var db;  

  12. export default class  SQLite extends Component{  

  13.     componentWillUnmount(){  

  14.     if(db){  

  15.         this._successCB('close');  

  16.         db.close();  

  17.     }else {  

  18.         console.log("SQLiteStorage not open");  

  19.     }  

  20.   }  

  21.   open(){  

  22.     db = SQLiteStorage.openDatabase(  

  23.       database_name,  

  24.       database_version,  

  25.       database_displayname,  

  26.       database_size,  

  27.       ()=>{  

  28.           this._successCB('open');  

  29.       },  

  30.       (err)=>{  

  31.           this._errorCB('open',err);  

  32.       });  

  33.     return db;  

  34.   }  

  35.   createTable(){  

  36.     if (!db) {  

  37.         this.open();  

  38.     }  

  39.     //创建用户表  

  40.     db.transaction((tx)=> {  

  41.       tx.executeSql('CREATE TABLE IF NOT EXISTS USER(' +  

  42.           'id INTEGER PRIMARY KEY  AUTOINCREMENT,' +  

  43.           'name varchar,'+  

  44.           'age VARCHAR,' +  

  45.           'sex VARCHAR,' +  

  46.           'phone VARCHAR,' +  

  47.           'email VARCHAR,' +  

  48.           'qq VARCHAR)'  

  49.           , [], ()=> {  

  50.               this._successCB('executeSql');  

  51.           }, (err)=> {  

  52.               this._errorCB('executeSql', err);  

  53.         });  

  54.     }, (err)=> {//所有的 transaction都应该有错误的回调方法,在方法里面打印异常信息,不然你可能不会知道哪里出错了。  

  55.         this._errorCB('transaction', err);  

  56.     }, ()=> {  

  57.         this._successCB('transaction');  

  58.     })  

  59.     }  

  60.   deleteData(){  

  61.     if (!db) {  

  62.         this.open();  

  63.     }  

  64.     db.transaction((tx)=>{  

  65.       tx.executeSql('delete from user',[],()=>{  

  66.       });  

  67.     });  

  68.   }  

  69.   dropTable(){  

  70.     db.transaction((tx)=>{  

  71.       tx.executeSql('drop table user',[],()=>{  

  72.       });  

  73.     },(err)=>{  

  74.       this._errorCB('transaction', err);  

  75.     },()=>{  

  76.       this._successCB('transaction');  

  77.     });  

  78.   }  

  79.     insertUserData(userData){  

  80.     let len = userData.length;  

  81.     if (!db) {  

  82.         this.open();  

  83.     }  

  84.     this.createTable();  

  85.     this.deleteData();  

  86.     db.transaction((tx)=>{  

  87.        for(let i=0; i

    51shop 网上商城系统
    51shop 网上商城系统

    51shop 由 PHP 语言开发, 使用快速的 MySQL 数据库保存数据 ,为中小型网站实现网上电子商务提供一个完美的解决方案.一、用户模块1. 用户注册:用户信息包括:用户ID、用户名、用户密码、性别、邮箱、省份、城市、 联系电话等信息,用户注册后不能立即使用,需由管理员激活账号,才可使用(此功能管理员可设置)2. 登录功能3. 资料修改:用户可修改除账号以后的所有资料4. 忘记密码:要求用

    下载
  88.         var user = userData[i];  

  89.         let name= user.name;  

  90.         let age = user.age;  

  91.         let sex = user.sex;  

  92.         let phone = user.phone;  

  93.         let email = user.email;  

  94.         let qq = user.qq;  

  95.         let sql = "INSERT INTO user(name,age,sex,phone,email,qq)"+  

  96.         "values(?,?,?,?,?,?)";  

  97.         tx.executeSql(sql,[name,age,sex,phone,email,qq],()=>{  

  98.           },(err)=>{  

  99.             console.log(err);  

  100.           }  

  101.         );  

  102.       }  

  103.     },(error)=>{  

  104.       this._errorCB('transaction', error);  

  105.       ToastAndroid.show("数据插入失败",ToastAndroid.SHORT);  

  106.     },()=>{  

  107.       this._successCB('transaction insert data');  

  108.       ToastAndroid.show("成功插入 "+len+" 条用户数据",ToastAndroid.SHORT);  

  109.     });  

  110.   }  

  111.   close(){  

  112.       if(db){  

  113.           this._successCB('close');  

  114.           db.close();  

  115.       }else {  

  116.           console.log("SQLiteStorage not open");  

  117.       }  

  118.       db = null;  

  119.   }  

  120.   _successCB(name){  

  121.     console.log("SQLiteStorage "+name+" success");  

  122.   }  

  123.   _errorCB(name, err){  

  124.     console.log("SQLiteStorage "+name);  

  125.     console.log(err);  

  126.   }  

  127.     render(){  

  128.         return null;  

  129.     }  

  130. };  

'react';  

  • import {  

  •   AppRegistry,  

  •   Text,  

  •   View,  

  •   Navigator,  

  •   StyleSheet,  

  • } from 'react-native';  

  • import SQLite from './sqlite';  

  • var sqLite = new SQLite();  

  • var db;  

  • class App extends Component{  

  •     compennetDidUnmount(){  

  •     sqLite.close();  

  •   }  

  •   componentWillMount(){  

  •     //开启数据库  

  •     if(!db){  

  •       db = sqLite.open();  

  •     }  

  •     //建表  

  •     sqLite.createTable();  

  •     //删除数据  

  •     sqLite.deleteData();  

  •     //模拟一条数据  

  •     var userData = [];  

  •     var user = {};  

  •     user.name = "张三";  

  •     user.age = "28";  

  •     user.sex = "男";  

  •     user.phone = "18900001111";  

  •     user.email = "2343242@qq.com";  

  •     user.qq = "111222";  

  •     userData.push(user);  

  •     //插入数据  

  •     sqLite.insertUserData(userData);  

  •     //查询  

  •     db.transaction((tx)=>{  

  •       tx.executeSql("select * from user", [],(tx,results)=>{  

  •         var len = results.rows.length;  

  •         for(let i=0; i

  •           var u = results.rows.item(i);  

  •           //一般在数据查出来之后,  可能要 setState操作,重新渲染页面  

  •           alert("姓名:"+u.name+",年龄:"+u.age+",电话:"+u.phone);  

  •         }  

  •       });  

  •     },(error)=>{//打印异常信息  

  •       console.log(error);  

  •     });  

  •   }  

  •     render(){  

  •         return null;  

  •     }  

 

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
C++ 设计模式与软件架构
C++ 设计模式与软件架构

本专题深入讲解 C++ 中的常见设计模式与架构优化,包括单例模式、工厂模式、观察者模式、策略模式、命令模式等,结合实际案例展示如何在 C++ 项目中应用这些模式提升代码可维护性与扩展性。通过案例分析,帮助开发者掌握 如何运用设计模式构建高质量的软件架构,提升系统的灵活性与可扩展性。

14

2026.01.30

c++ 字符串格式化
c++ 字符串格式化

本专题整合了c++字符串格式化用法、输出技巧、实践等等内容,阅读专题下面的文章了解更多详细内容。

9

2026.01.30

java 字符串格式化
java 字符串格式化

本专题整合了java如何进行字符串格式化相关教程、使用解析、方法详解等等内容。阅读专题下面的文章了解更多详细教程。

12

2026.01.30

python 字符串格式化
python 字符串格式化

本专题整合了python字符串格式化教程、实践、方法、进阶等等相关内容,阅读专题下面的文章了解更多详细操作。

4

2026.01.30

java入门学习合集
java入门学习合集

本专题整合了java入门学习指南、初学者项目实战、入门到精通等等内容,阅读专题下面的文章了解更多详细学习方法。

20

2026.01.29

java配置环境变量教程合集
java配置环境变量教程合集

本专题整合了java配置环境变量设置、步骤、安装jdk、避免冲突等等相关内容,阅读专题下面的文章了解更多详细操作。

18

2026.01.29

java成品学习网站推荐大全
java成品学习网站推荐大全

本专题整合了java成品网站、在线成品网站源码、源码入口等等相关内容,阅读专题下面的文章了解更多详细推荐内容。

19

2026.01.29

Java字符串处理使用教程合集
Java字符串处理使用教程合集

本专题整合了Java字符串截取、处理、使用、实战等等教程内容,阅读专题下面的文章了解详细操作教程。

3

2026.01.29

Java空对象相关教程合集
Java空对象相关教程合集

本专题整合了Java空对象相关教程,阅读专题下面的文章了解更多详细内容。

6

2026.01.29

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
SQLite参考手册
SQLite参考手册

共0课时 | 0人学习

SQLite经典教程
SQLite经典教程

共51课时 | 24.1万人学习

React Native进阶精讲视频教程
React Native进阶精讲视频教程

共17课时 | 3.4万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号