初始化文件夹
cordova create cordova-app com.lxlazy.www.app cordovaApp
进入
cd cordova-app
添加平台使用630API不然找不到
cordova platform add android@6.3.0
检查依赖
cordova requirements
真机调试
cordova run
添加插件
cordova plugin add XXXX
查看安装的插件
cordova plugins
卸载插件
cordova plugin remove XXXX
编译
cordova build android
开启开发服务器 npm run dev
编译web文件,更新cordova设置,编译apk并下载到手机运行 npm run update
首先运行cordova plugin add XXXX安装好插件
然后注册到vue-cordova插件方便vue组件使用,如下操作:
exports.install = function (Vue, options, cb) { document.addEventListener('deviceready', () => { if (typeof bluetoothSerial === 'undefined') { return cb(false) } // pass through the bluetoothSerial object Vue.cordova.bluetoothSerial = bluetoothSerial return cb(true) }, false)}
然后在上述目录的index.js注册
最后,在vue中使用的方法
data: function () { return { cordova: Vue.cordova } }
插件加载好后会被vue-cordova挂在在这里。
这样拿到后就可以参考cordova的相应文档使用了。
cordova的插件也可从window上获取,如window.navigator.vibrate(100)
先在dev下完善ui和逻辑,也可在真机上调试web:
打开 Chrome 浏览器,输入地址chrome://inspect,默认进入 chrome://inspect/#devices,将在页面显示当前可用设备,点击链接弹出控制台界面,然后跟普通页面一样调试
之后使用npm run update安装到手机进行混合应用调试
png图标放在res/android目录下,可分大中小,详见cordova
之后修改congig.xml中响应内容即可
一 震动手机
安装vibrate插件
window.navigator.vibrate(Time in ms);
二 蓝牙串口
安装 bluetoothSerial 项目地址
这是个和蓝牙串口模块通信的插件
使用流程:
获取设备列表 Vue.cordova.bluetoothSerial.list
链接设备 Vue.cordova.bluetoothSerial.connect
向设备发送 Vue.cordova.bluetoothSerial.write
监听设备回复 Vue.cordova.bluetoothSerial.subscribe
三 存储简单数据
简便方法是使用h5的storage特性,无存储期限限制,但大小不得过大,详细介绍
例子如下
SaveCurrentData: function () { //var value = storage.getItem(key); // 传递键的名字获取对应的值。 var value = JSON.stringify(this.pineappleNums);//将要存储的内容序列化 //console.log('SaveCurrentData: ', value); localStorage.setItem('pineappleNums', value) // 传递键的名字和对应的值去添加或者更新这个键值对。 //storage.removeItem(key) // 传递键的名字去从LocalStorage里删除这个键值对。},restoreData: function () { var value = localStorage.getItem('pineappleNums'); // 传递键的名字获取对应的值。 console.log('restoreData:', JSON.parse(value)); if (value != null) { this.pineappleNums = JSON.parse(value); }}
链接:https://pan.baidu.com/s/1wcaCn4PPFGnSxBcYjWFKEg 密码:7w8b
无需再npm install
联系客服