main.js

import AutoUpdateApp from './common/AutoUpdateApp/AutoUpdateApp' //我存放AutoUpdateApp.js的目錄 Vue.use(AutoUpdateApp)

AutoUpdateApp.js

export default {install(Vue,options){Vue.prototype.AutoUpdateApp = function () {return {// 獲取本地應用資源版本號getVersion: function (CallBack) {var wgtVer = null;//異步操作plus.runtime.getProperty(plus.runtime.appid,(info) => {wgtVer = info.version;CallBack(wgtVer);});},//下載wgt文件downWgt: function (wgtUrl) {var self = this;plus.nativeUI.showWaiting("下載更新文件...");plus.downloader.createDownload( wgtUrl, {filename:"_doc/update/"}, function(d,status){if ( status == 200 ) { console.log("下載更新文件成功：" + d.filename);self.installWgt(d.filename); // 安裝wgt包} else {plus.nativeUI.alert("下載失敗！");}plus.nativeUI.closeWaiting();}).start();},// 更新應用資源installWgt: function (path) {plus.nativeUI.showWaiting("安裝更新文件...");plus.runtime.install(path,{},function(){plus.nativeUI.closeWaiting();plus.nativeUI.alert("應用資源更新完成！",function(){plus.runtime.restart();});},function(e){plus.nativeUI.closeWaiting();plus.nativeUI.alert("安裝更新文件失敗[" + e.code + "]：" + e.message);if(e.code == 10){plus.nativeUI.alert('請清除臨時目錄');}});}}};}}

vuex的store.js文件的actions

autoupdateapp: function (context) {let AutoUpdateApp = new window.Vue.AutoUpdateApp();let wgtVer = plus.runtime.version;axios.post('/point-api-autoupdateapp',{appid:plus.runtime.appid,appname:'queue'}).then(function(response){ let newVer = response;//檢查更新if(wgtVer && newVer && (wgtVer.substring(0,3) < newVer.versionName.substring(0,3))){if(window.confirm('檢測到更新,是否更新?')){AutoUpdateApp.downWgt(newVer.apk); }} }, function(response){mui.toast('網絡錯誤');});}

在需要的組件的 mounted或created調用

// 初始化創建對象mui.plusReady(() => {this.$store.dispatch('autoupdateapp');});

php的models代碼

public static function AutoUpdateApp($params) {extract($params);$versionName = '';if($appname == 'queue'){$versionName = '1.2.0';}elseif($appname == 'waiter'){$versionName = '1.2.0';}elseif($appname == 'pos'){$versionName = '1.2.0';}$data = ['versionName' => $versionName,'apk' => $SERVER['REQUEST_SCHEME'].'://'.$_SERVER['HTTP_HOST'].'/app/'.$appid.'.wgt',//存放更新資源的目錄];return self::formatBody('data' => $data); }

總結

以上是生活随笔為你收集整理的Vue封装hbuilder热更新的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。