传参
这里带大家了解下 Mobilebone 中各个页面转场过程中参数是如何传递的。
Mobilebone 支持两种类型的页面显示,一种是请求外部数据并创建页面,一种是内置的页面元素的显示,每一种类型的页面显示方法都可以进行参数的传递。
请求传参
Mobilebone 中的页面数据请求均是GET请求,请求的参数可以直接写在 URL 地址上面,例如:
<a href="detail.html?id=1&type=0">加载</a>
其中的 id=1&type=0
就是请求的参数,也可以使用 data-formdata
属性进行参数设置,例如:
<a href="detail.html" data-formdata="id=1&type=0">加载</a>
补充:这里使用 data-params
可以有一样的效果,不过并不推荐使用,因为 data-params
主要用来传递请求相关的参数的,例如数据类型、超时时间、成功的回调等。
<a href="detail.html" data-params="id=1&type=0">加载</a>
页面内传参
页面内传参也是类似的,例如:
<a href="#myPage?id=1&type=0">前往</a>
也可以使用 data-formdata
属性进行参数设置,例如:
<a href="#myPage" data-formdata="id=1&type=0">加载</a>
补充:这里使用 data-params
可以有一样的效果。
获取
参数可以在 Mobilebone 的声明周期函数中获取,拿 callback
函数举例,例如:
Mobilebone.callback = function (pageInto, pageOut, options) { console.log(options.query); };
其中,options
参数中的 query
属性就包含了所有的传参数据。例如:
<a href="#myPage?id=1&type=0">前往</a> <div id="myPage" class="page out"></div>
则当 #myPage
这个页面元素进入的时候,就会在控制台输出这样的数据:
{ id: "1", type: "0" }
此时,开发者就可以基于 options.query
返回的参数内容进行对应的业务处理了。
发现错误?想参与编辑?在 GitHub 上编辑此页!