搜索到
4
篇与
的结果
-
还学鸿蒙原生？vue3 + uniapp 可以直接开发鸿蒙啦！ 前言7月20号，uniapp 官网 “悄咪咪” 的上线了 uniapp 开发鸿蒙应用 的文档，算是正式开启了 Vue3 + uniapp 开发鸿蒙应用 的时代。开发鸿蒙的前置准备想要使用 uniapp 开发鸿蒙，我们需要具备三个条件：DevEco-Studio 5.0.3.400 以上（下载地址：https://developer.huawei.com/consumer/cn/deveco-studio/）鸿蒙系统版本 API 12 以上 （DevEco-Studio有内置鸿蒙模拟器）HBuilderX-alpha-4.22 以上PS： 这里不得不吐槽一下，一个 DevEco-Studio 竟然有 10 个 G......[安装好之后，我们就可以通过 开发工具 运行 示例代码]运行时，需要用到 鸿蒙真机或者模拟器。但是这里需要 注意： Windows系统需要经过特殊配置才可以启动，mac 系统最好保证系统版本在 mac os 12 以上windows 系统配置方式（非 windows 用户可跳过）： 打开控制面板 - 程序与功能 - 开启以下功能Hyper-VWindows 虚拟机监控程序平台虚拟机平台注意: 需要win10专业版或win11专业版才能开启以上功能，家庭版需先升级成专业版或企业版启动鸿蒙模拟器整个过程分为三步（中间会涉及到鸿蒙开发者申请）：下载 uni-app 鸿蒙离线SDK template-1.3.4.tgz （下载地址：https://web-ext-storage.dcloud.net.cn/uni-app/harmony/zip/template-1.3.4.tgz）解压刚下载的压缩包，将解压后的模板工程在 DevEco-Studio 中打开等待 Sync 结束，再 启动鸿蒙模拟器 或 连接鸿蒙真机（如无权限，则需要申请（一般 3 个工作日），申请地址：https://developer.huawei.com/consumer/cn/activity/201714466699051861/signup）配置 HBuilderX 吊起 DevEco-Studio打开HBuilderX，点击上方菜单 - 工具 - 设置，在出现的弹窗右侧窗体新增如下配置[注意：值填你自己的 DevEco-Studio 启动路径]"harmony.devTools.path" : "/Applications/DevEco-Studio.app"创建 uni-app 工程BuilderX 新建一个空白的 uniapp 项目，选vue3在 manifest.json 文件中配置鸿蒙离线SDK路径（SDK 路径可在 DevEco-Studio -> Preferences(设置) z中获取）编辑 manifest.json 文件，新增如下配置：然后点击 运行到鸿蒙即可最后这样我们就有了一个初始的鸿蒙项目，并且可以在鸿蒙模拟器上运行。关于更多 uniapp 开发鸿蒙的 API，大家可以直接参考 uniapp 官方文档：https://zh.uniapp.dcloud.io/tutorial/harmony/dev.html#nativeapi -
-
-
uni-app中的版本更新 主要是拿本地的版本号和后端返回的版本号做对比（在每次修改完代码以后，要打个更新包或者整包给后端喔） <template> <view> <sxPopup ref="appUpdate" @closeMaks="closeMaks"> <view class="update-main"> <image src="/static/images/update_close.png" class="update-close" @tap="hide"></image> <view class="update-content"> 最新安装包已准备就绪恭请主人体验尝 </view> <view class="update-btn btn-solid" @tap="updateApp"> 立即体验 </view> </view> </sxPopup> </view> </template> 在data中定义 version:"", // 当前版本 serverVersion:"", // 服务器版本 clientType:'', // 客户端类型 updateInfo:{}, // 更新信息 curDownSize:0, // 当前下载大小 在props中 autoChangeUpdate:{ // 是否自动检测更新 type:Boolean, default:false } mounted() { _this = this; this.changeUpdate() }, 在methods中 show(){ //显示更新弹窗 this.$refs.appUpdate.open() }, hide(){ //隐藏更新弹窗 uni.showTabBar(); this.$refs.appUpdate.close() }, changeUpdate(){ // 检测更新 //如果父组件选择自动更新 if(this.autoChangeUpdate){ this.getServerVersion() } }, isUpdate(curVersion,serVersion){ // 判断是否需要更新 let [serArray,curArray] = [serVersion.split("."),curVersion.split(".")] if(parseInt(serArray[0]) > parseInt(curArray[0])){ return true }else if(parseInt(serArray[1]) > parseInt(curArray[1])){ return true }else if(parseInt(serArray[1]) >= parseInt(curArray[1]) && parseInt(serArray[2]) > parseInt(curArray[2])){ return true }else{ return false } }, computedVersion(version){ // 计算版本 let array = version.split("."); let sum = 0; sum += array[0]*10 sum += array[1]+array[2] return sum; }, getServerVersion(){ // 获取服务器版本 if(!this.autoChangeUpdate){ uni.showLoading({ title:"检测更新" }) } this.$ajax("index/apiUpdateVersion",{}).then(res=>{ uni.hideLoading() if(res.code == 200){ this.updateInfo = res.data plus.runtime.getProperty(plus.runtime.appid, function(wgtinfo) { // 获取当前app版本 _this.version = wgtinfo.version; console.log(uni.getSystemInfoSync().platform) // 判断手机类型 switch (uni.getSystemInfoSync().platform) { case 'android': if (_this.isUpdate(_this.version,res.data.android_version)) { _this.serverVersion = res.data.android_version; _this.clientType = 'android' _this.show() uni.hideTabBar(); }else{ if(!_this.autoChangeUpdate){ _this.$toast("当前已是最新版本") } } break; case 'ios': if (_this.isUpdate(_this.version,res.data.ios_version)) { _this.serverVersion = res.data.ios_version; _this.clientType = 'ios' _this.show() uni.hideTabBar(); }else{ if(!_this.autoChangeUpdate){ _this.$toast("当前已是最新版本") } } break; } // _this.$emit('isUpdata',false) }); }else{ this.$toast(res.data.msg) } }) }, updateApp(){ // 更新app let version = this.version.split('.'); let updateVersion = this.serverVersion.split('.'); this.hide() // 大更新 if (parseInt(updateVersion[0]) > parseInt(version[0])) { if(_this.clientType == 'android'){ console.log(_this.clientType) console.log(this.updateInfo.android_url) this.downApp(this.updateInfo.android_url,'bigUpdate'); }else{ plus.runtime.openURL(this.updateInfo.ios_url) } } else if (parseInt(updateVersion.join('.').replace(/\./g, '')) > parseInt(version.join('.').replace(/\./g, ''))) { //小更新 // 热更新 this.downApp(this.updateInfo.hot_update,'thermalRenewal'); } }, downApp(url,updateType){ // 文件大小 let fileSize = ''; if(updateType == 'bigUpdate'){ fileSize = this.updateInfo.android_url_file_size; }else{ fileSize = this.updateInfo.hot_update_file_size; } fileSize = parseFloat(fileSize) * 1024 * 1024 console.log(fileSize) let waiting = plus.nativeUI.showWaiting('下载中...'); // 创建下载任务 let dtask = plus.downloader.createDownload(url,{ filename: '_doc/update/' // 文件下载保存路径 },function(d, status) { console.log(status,5555) if (status == 200) { console.log(status,'.............') waiting.setTitle('安装中...'); // 下载成功 plus.runtime.install(d.filename, {}, function() { plus.nativeUI.closeWaiting(); plus.nativeUI.alert('更新完成！', function() { uni.showTabBar(); // 清除所有下载的包 plus.downloader.clear(-1); // 热更新自动安装 if(updateType == 'thermalRenewal'){ plus.runtime.restart(); } }); }, function(e) { plus.nativeUI.closeWaiting(); plus.nativeUI.alert('安装失败[' + e.code + ']：' + e.message); }); } else { //下载失败 plus.nativeUI.alert('下载失败！'); setTimeout(()=>{ plus.nativeUI.closeWaiting(); },1000) if(updateType == 'bigUpdate'){ plus.runtime.openURL(url) //打开网页手动下载 } } }) // 监听下载状态 // dtask.addEventListener("statechanged", function(download, status) { // // console.log(`监听:下载状态${status}`) // if (status == 200) { // let i = download.downloadedSize // i *= 100 / fileSize; // console.log(`监听:下载大小${i}`) // if(!isNaN(i)){ // i = parseInt(i) // waiting.setTitle('已下载 ' + i + "%"); // // waiting.setTitle(i); // } // }else if(status == 404){ // plus.nativeUI.closeWaiting(); // plus.runtime.toast("下载地址错误") // } // }, true); dtask.start(); }
