[学习笔记] Cordova+AmazeUI+React 做个通讯录 - 使用 SQLite

[学习笔记] Cordova+AmazeUI+React 做个通讯录 系列文章

目录

1. 准备
2. 联系人列表(1)
3. 联系人列表(2)
4. 联系人详情
5. 单页应用 (With Router)
6. 使用 SQLite

---

传送门：全部章节 示例代码

---

通讯录做到这个程度，应该考虑增删改功能了。但是，增删改功能的前提是能进行相应的数据持久化操作。因为需要先研究在 Cordova 中使用 SQLite。

为 Cordova 添加 SQLite 插件

在 Apache Cordova Plugin Search 页面搜索 sqlite。排名靠前的有 cordova-sqlite-storage 和 cordova-plugin-sqlite 等，从下载量来看，我选择了前者。

Apache Cordova Plugin Search 打开之后会需要一些时间来加载数据，所以得等一等才会出现搜索框。

虽然搜索是在这里搜，但是安装是在控制台下。进入 contacts 目录（也就是 www 的上级目录），然后运行这个命令

cordova plugin add cordova-sqlite-storage 

准备试运行和调试

deviceready

cordova-sqlite-storage 插件会为 window 添加 sqliteDatebase 属性，但必须在设备准备好之后才能使用，所以需要等等触发 Cordova 的 deviceready 事件。之前生成的 index.js 还没有删除掉，所以可以看到注册和响应 deviceready 事件的代码。

示例代码中定义了 app 对象，其 initialize 方法是入口，在最下面调用。而 initialize 只干了一件事就是 bindEvents，bindEvents 也只干了一件事就是将 deviceready 事件绑定到处理函数 this.onDeviceReady。这整个过程实在复杂，所以用立即执行的函数简化一下

(function() {
    function onDeviceReady() {
        console.log("device is ready");
    }

    document.addEventListener("deviceready", onDeviceReady, false);
})();

引入 cordova.js

由于之前把引入 cordova.js 的

这个