MADP2.0框架,给前端页面(用Weex、Vue、Vx写的)提供了一个context对象,用于功能场景间的跳转以及数据传递。
Weex页面里的context对象,其实是客户端原生代码实现的一个Weex扩展插件Module,注册的模块名字为context。
1、Weex源码文件里,在可编写js脚本代码的地方,先做声明引入context模块对象,再使用context对象。
例如:
//先声明原生扩展Module名字为context的对象
const context = weex.requireModule('context');
export default {
methods: {
closePage() {
context.finish(); //调用context对象提供的方法
}
}
}
2、仓库配置文件(repo.json)配置的某个Weex功能场景的module字段的值一定要配置为weex,表示要走MADP2.0客户端里的页面路由名字为"weex"来打开这个Weex页面。 例如:
"login": {
"name": "登录",
"module": "weex",
"path": "./login/index.weex.js",
"params": {
"x-fullscreen": "yes"
},
"preferences": {},
"icon": "icon.png",
"auth_check": []
}
采用MADP2.0框架开发的手机客户端App里内嵌的原生控件WebView在加载Web页面时,已经在产品库级别的代码serviceworker层里将context对象注入到Web页面中。编写功能业务的Web开发人员直接使用context对象即可。
Vx页面相当于Web页面。
1、Vx页面源码写js脚本的地方,可直接调用context对象的方法,无需做引入声明。
1)在纯Vx页面的初始化函数里执行的代码流程里(包括在初始化函数里调用的其他函数里使用context),使用context对象时需要放在setTimeout方法里使用。 因为这时候MADP SDK有可能还没把context对象注入到webView容器, 这时候使用这个context对象会报错context is undefined。
2)Vx的.js文件里,在不是初始化函数的地方,例如点击事件触发的方法里,可直接调用context对象的方法,无需做引入声明。
$scope.isLogin=function(){
if(context.sessionGetString("isLogin")=="true"){
return "true";
}else{
return "false";
}
}
2、仓库配置文件(repo.json)配置的某个Vx功能场景的module字段的值一定要配置为web,表示要走MADP2.0客户端里的页面路由名字为"web"来打开这个Vx页面。例如:
"myaccount": {
"name": "我的账户",
"module": "web",
"path": "./vx/index.html#/MyAccount",
"params": {
"x-fullscreen": "yes"
},
"preferences": {},
"icon": "icon.png",
"auth_check": ["sub != '' | login?text=请先登录"]
}
采用MADP2.0框架开发的手机客户端App里内嵌的原生控件WebView在加载Web页面时,已经在产品库级别的代码serviceworker层里将context对象注入到Web页面中。编写功能业务的Web开发人员直接使用context对象即可。
纯Vue.js框架写的Vue页面相当于Web页面。
1、纯Vue页面源码写js脚本的地方,可直接调用context对象的方法,无需做引入声明。 但是分两种情况,需要注意如下说明。
1)在纯Vue页面的生命周期函数create或mounted里执行的代码流程里(包括在生命周期方法mounted里调用的其他函数里使用context),使用context对象时需要放在setTimeout方法里使用, 因为这时候MADP SDK有可能还没把context对象注入到webView容器, 这时候使用这个context对象会报错context is undefined。
例如:
mounted(){
setTimeout(()=>{
let flag = context.sessionGetString("isIphoneX");
if(flag=="true"){
//TODO
}
},100)
}
2)在纯Vue页面已经显示的情况下,例如,用户行为触发的其他方法里,可以直接使用context对象,无需做引入声明。
2、仓库配置文件(repo.json)配置的某个Vue功能场景的module字段的值一定要配置为web,表示要走MADP2.0客户端里的页面路由名字为"web"来打开这个Vue页面。 例如:
"productIntroductions": {
"name": "产品介绍",
"module": "web",
"path": "./vue/index.html#/productIntroductions",
"params": {
"x-fullscreen": "yes"
},
"preferences": {},
"icon": "icon.png",
"auth_check": []
}