基于HBuilder mui页面间传值的几种方式总结

采用MUI开发APP时，页面跳转传值无疑是很多初学者遇到的难题之一，我在开发时也遇到了同样的问题，所以在这里总结了一下，方便以后查阅。

一、页面预加载时传值

mui.init({  preloadPages:[{      url:prelaod-page-url,      id:preload-page-id,      styles:{},      extras:{        name:'zqm'      },//在这里添加要传递的参数      ...    },    ...]});或如下var page = mui.preload({      url:new-page-url,     id:new-page-id,      styles:{},      extras:{        name:'zqm'    //自定义扩展参数      }});

通过上述方法预加载页面，然后在加载的那个页面中接受参数。

mui.plusReady(function(){    var self = plus.webview.currentWebview();    var name = self.name;//获得参数});

二、通过mui.openWindow打开窗口向页面传递参数

这种传值方法通常我们的做法如下：

在参数生成页面中

mui.openWindow({         id: 'list.html',         url: 'list.html',         show: {                aniShow: 'pop-in'          },           extras: {    //extras里面的就是参数了                name: "zqm"           },           waiting: {                 autoShow: true, //自动显示等待框，默认为true           }  });

在参数接收页面中

mui.plusReady(function(){    var self = plus.webview.currentWebview();    var name = self.name;//获得参数});

通常我们传参就这么进行，但是由于这个页面，多次被打开，发生了类似缓存的现象，所以，有时候这个plusReady不能保证每次都能执行。所以，我增加了一个自定义事件，来改变这个情况，实现方法如下（我是双管齐下，plusReady也获取值，自定义事件也获取值）。

那好，下面我演示一下我的方法（下面这个监听一个按钮，然后打开一个页面）；

var apage = null; mui.plusReady(function() {        mui.preload({               url: "list.html",              id: "list.html", //默认使用当前页面的url作为id              styles: {}, //窗口参数               extras: { name: "预加载的参数" } //自定义扩展参数           });document.getElementById("bbtn").addEventListener('tap',function({        if(apage == null) {        //要进入list.html，第一次，它肯定为空，所以，此时下面的这个fire方法，是不会执行的。             apage = plus.webview.getWebviewById("list.html");         }         mui.fire(apage, 'hahaha',{ name: "zqm" });           apage.show();     }); });

接下来，就到了参数接收页面，如下（首先，我们还是要在plusReady里面接收一次，因为你不能保证这次是初次打开还是第二次打开页面，所以，这个还是需要的。）