weex混合开发的一些记录

发表于 | 更新于 | 评论数：
本文字数： 2.1k | 阅读时长 ≈ 2 分钟

前言

最近在研究weex，据我了解weex基本两种玩法，一种是混合开发（可热更新）生成app的h5页面和生成让原生渲染控件的js(需要有一定了解android/ios开发，需要接入sdk和一些处理)，另一种为直接打包为一个android/ios项目（不具备热更新）。
这里记录的主要是前者。

接入前需要了解的坑点

  1. h5的页面（本文统称h5）和用js渲染原生控件的页面（本文统称原生js）并不完全兼容，例如原生js可以调android自己定义的方法，在生成的h5是失效的，。
  2. post请求据我接触，h5页面只能不支持post表单，只能post json，原生js两种都可以。
  3. 原生js有一定几率对一些机型系统不兼容，接入原生js最好得重写自己的网络请求适配，目前自带的网络请求超时只设了3s，目前文档中找不到修改的方法。
  4. 官方文档不够齐全，资料也比较少，一些细节和坑资料查找不方便。\

使用

发送请求

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
getNews(url, callback) {
	 			return stream.fetch({
					method: 'GET',
					dataType: 'json',
					url: url
				}, callback);
					return stream.fetch({
								method: 'POST',
								dataType: 'json',
								type: 'application/x-www-form-urlencoded',
								body: 'username=1&token=1&startTime=2018-1-1&endTime=2019-1-1',
								url: url
							}, callback);
			}

跳转页面 带传值

1
2
3
4
5
6
7
8
9
10
11
12
const navigator = weex.requireModule('navigator'); //跳转
			//跳转下个界面
			navigator.push({
				url: './otherpage.js'+ '?p1=hahaha&p2=6666'
			
			});
			//返回上个界面
			  navigator.pop()
			  
			  //下个页面获取值
			  this.$getConfig().p1
			  this.$getConfig().p2

全局保存数据

1
2
3
4
5
6
7
8
const storage = weex.requireModule('storage');
storage.setItem('name', 'Hanks', event => {
			});
 storage.getItem('name', event => {
          modal.toast({ message:event.data });
        
      });

调用android方法

weex

1
2
3
4
weex.requireModule('MyModule').printLog("发送数据");
weex.requireModule('MyModule').gmessage("dddddddddd",function(v) {
						//v.token
});

android

在Application注册

1
WXSDKEngine.registerModule("MyModule", MyModule.class);

定义模块

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
public class MyModule extends WXModule {
    @JSMethod(uiThread = true)
    public void printLog(String msg) {
          showToast(msg);
    }
	
	
	@JSMethod(uiThread = true)
    public void gmessage(String msg,JSCallback callback) {
        Map<String,String> data=new HashMap<>();
        data.put("token","这是手机回传的数据"+msg);
        data.put("smart","2222");
        callback.invokeAndKeepAlive(data);
    }
	
	
}