【WEEX】weex与安卓原生之间的页面跳转
在做一个app的时候,通常我们会写安卓和IOS两种页面,但是使用weex可以只写一次代码,将其嵌入到安卓和IOS相对应的地方。weex和安卓之间的页面跳转一般有三种情况:weex->weexnative->weexweex->native一.weex->weex(weex页面之间跳转)例如:a页面跳转到b页面a页面:navigator.push({url:"http://d
在做一个app的时候,通常我们会写安卓和IOS两种页面,但是使用weex可以只写一次代码,将其嵌入到安卓和IOS相对应的地方。
weex和安卓之间的页面跳转一般有三种情况:
- weex->weex
- native->weex
- weex->native
一.weex->weex(weex页面之间跳转)
例如:a页面跳转到b页面
a页面:
navigator.push({
url:"http://dotwe.org/raw/dist/38e202c16bdfefbdb88a8754f975454c.bundle.wx",
animated:"true",
},event=>{});
参数:
url:b页面的url(猜测是发布后的js文件的地址)
animated:是否跳转时有动画
event:跳转之后的callback操作
跳转时可能有参数传递,下面介绍一下百度来的参数传递方式
1.直接在url后面添加参数
2.使用全局参数storage
3.使用广播BroadcastChannel
详情weex页面间的通讯(传参)
二.native->weex(安卓跳转到weex页面)
首先我们可以新建一个WXPageActivity,然后在这个acitvity里面渲染weex页面
public class WXPageActivity extends AppCompatActivity implements IWXRenderListener {
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
View view=findViewById(R.id.view); //在哪里渲染weex
mWXSDKInstance = new WXSDKInstance(this);
mWXSDKInstance.registerRenderListener(this);
try {
asyncLoadPages(view,url,param);
} catch (JSONException e) {
e.printStackTrace();
}
}
private void asyncLoadPages(final View view, String url, Map<String,Object> param) throws JSONException {
if(!WXSDKEngine.isInitialized()) { //初始化未完成
view.postDelayed(new Runnable() {
@Override
public void run() {
try {
asyncLoadPages(view,url,param);
} catch (JSONException e) {
e.printStackTrace();
}
}
}, 1);
} else {
loadPages(url,param);
}
}
private void loadPages(String url,Map<String,Object> param) throws JSONException {
String pageName = "WXSample";
String bundleUrl = url; //weex的js文件的url
mWXSDKInstance.renderByUrl(pageName, bundleUrl, param, null, WXRenderStrategy.APPEND_ASYNC);
}
}
三.weex->native(weex跳转到安卓原生页面)
实际上,无论是weex之间的跳转还是weex和原生互相跳转,我们都可以将其放在原生里面去操作
首先,我们在原生那里注册一个module
public class WxNavEvent extends WXModule {
//这里可以写一些方法,在weex页面直接调用
@JSMethod(uiThread = false)
public void pushView(String name,Map<String,Object> param){
Activity activity=(Activity)mWXSDKInstance.getContext();
Intent intent=new Intent(activity,activity1.class);
activity.startActivity(intent);
}
}
//不要忘记注册,在初始化配置WxSDK的时候
WXSDKEngine.registerModule("wxNavEvent", WxNavEvent.class);
在weex中的调用
const weexNav=weex.requireModule("wxNavEvent");
//直接调用方法
weexNav.pushView("name",{}); //参数一定要传
以上是weex->native,实际上我们也可以利用原生实现weex->weex,比如我用的下面的这个笨方法
@JSMethod(uiThread = false)
public void pushWeexView(String url, Map<String,Object> param){
Activity activity=(Activity)mWXSDKInstance.getContext();
Intent intent=new Intent(activity,WXPageActivity.class);
intent.putExtra("url",url); //weex的js文件的url
intent.putExtra("param",JSON.toJSONString(param));//字典型的参数
activity.startActivity(intent);
}
撒花完结~
更多推荐


所有评论(0)