React Native Android 开发中遇到的坑

react native 更新非常活跃，下面的总结可能在后续会被完善修改好，根据react native 版本情况采用下面的方法，
我在使用的时间是 2015年12月10日。

React Native第三方lib地址 (https://react.parts/native)
Android上的webview 不可用 要用第三方的库，我在项目中使用的webview 是https://github.com/lucasferreira/react-native-webview-android

---

网络请求方式，我使用官网的示例代码并没用成功，简单修改后才能使用 示例如下：

fetch(reqUrl, {
            method: 'POST',
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json',
            },
            body: JSON.stringify(post_data)
        }).then((response) => response.json())
            .then((responseText) => {
                console.log(responseText);
                this.setState({
                    isLoading: false,
                    response: responseText,
                });
            })
            .catch((error) => {
                this.setState({
                    isLoading: false,
                    response: null,
                });
            });

不同于修改JS代码能直接生效，每一次在Android 项目添加图片或者修改 Android原生项目的资源的时候，要重新运行 react-native run-android ，生成资源文件。

图片大小的控制 需要靠 drawable-hdpi 还是 xhdpi、xxhdpi 等资源目录名字控制，例如相同的图片放在hdpi会放大一些，xhdpi精度会高一些。

---

React Components 组件间传参
在MianPage页面代码如下

onSelectMenu: function () {
    this.goToSetting();
    this.refs[DRAWER_REF].closeDrawer();
},

<MenuList
    onSelectMenu={this.onSelectMenu}
    />

在 MenuListPage 使用传递过来的参数如下，需要注意的是 onSelectMenu 这个方法名字要一致

<TouchableHighlight
    style={styles.touchable}
    underlayColor="#B3E5FC"
    onPress={this.props.onSelectMenu}>
    <Text style={styles.text}>
        设置
    </Text>
</TouchableHighlight>

通过学习下面的官方文档了解如何传参：
React 组件通过一个render()方法，接受输入的参数并返回展示的对象。
以下这个例子使用了 JSX，它类似于XML的语法

输入的参数通过render()传入组件后，将存储在this.props

JSX 是可选的，并不强制要求使用。

点击 “Compiled JS” 可以看到 JSX 编译之后的 JavaScript 代码
Live JSX Editor

var HelloMessage = React.createClass({
  render: function() {
    return <div>Hello {this.props.name}</div>;
  }
});

React.render(<HelloMessage name="John" />, mountNode)

输出结果：Hello John

---

自定义native 控件 在int等值传参时候的定义办法 以及报错的时候排错思路，要打开Android logcat 工具 看Android端的报错才能分析出来，
如果要求参数是int,使用的时候因为js的传参是String 例如
要用这种方式调用 ：textSize= {20} 如果用 textSize= “20”,这种方式会报错

@ReactProp(name = "textSize", defaultFloat = 12f)
    public void setTextSize(TextView view, float texs) {
        view.setTextSize(textSize);
    }

---

我的kindle助手项目 react 版本地址：https://github.com/wudizhuo/kindle_react