1、React Native 在windows下的环境搭建
我参考的博文:
http://my.oschina.net/jackzlz/blog/508210?fromerr=dfJREYAF
PS:最重要的一点,在windows下要安装C++环境
2、React与React Native的关系
我的理解:这和Java与Android的关系差不多,React Native使用的是React.js的语法,ReactNative主要负责把js变成apk。
3、Ubuntu下搭建react native开发环境,参考官网,搭建过程中遇到的问题
一、eclipse sdk manager无法打开,提示找不到java
解决方法
(1) 进入到sdk所在的目录的tools文件夹下,打开'andriod'可执行文件
(2) 修改java-cmd变量为你jdk中java的路径
二、eclipse无法显示菜单
写一个文件,命名为eclipse.sh:
写入如下内容:
export UBUNTU_MENUPROXY=0
/home/xuzhifan/soft/adt/eclipse/eclipse(你的eclipse程序的路径)
如何启动呢?
进入eclipse.sh所在文件夹,在命令行输入sh eclipse.sh
三、配置好sdk后,仍提示没有adb,这是因为adb是32位程序,64位的ubuntu不支持。
怎么解决:
sudo apt-get install -y libc6-i386 lib32stdc++6 lib32gcc1 lib32ncurses5 lib32z1
四、watchman安装不成功,解决
cd watchman
sudo apt-get install python-dev (所需的环境)
sudo apt-get install autoconf (所需的环境)
./autogen.sh
./configure
make
sudo make install
五、按官网那样安装的node的版本太低不能用,所以要自己到node.js官网下载并安装
4、学习过程参考的博客
搭建React Native for Android Windows开发环境
React Native 中文网(好东西)
React中文网(好东西)
React-Native之Android:原生界面与React界面的相互调用
(页面调转)React Native——使用导航Navigator and NavigatorIOS
ReactNative Animated动画详解
ReactNative入门 —— 动画篇(上)
React Native学习小结
新手理解Navigator的教程
5、React Native编辑器Atom
我安装的插件:atom-beautify(格式化代码)、Nuclide(react native代码提示)、atom-terminal
安装步骤:Packages->Settings View->Install Packages->输入插件名->搜索->点install->重启
6、react native最低支持android sdk 16
证据如下:
> Manifest merger failed : uses-sdk:minSdkVersion 11 cannot be smaller than version 16 declared in library [com.facebook.react:react-native:0.22.2] /home/xuzhifan/workspace/ReactNativeDemo/AwesomeProject/android/app/build/intermediates/exploded-aar/com.facebook.react/react-native/0.22.2/AndroidManifest.xml
7、下面文字的出处
由于众所周知的网络原因,react-native命令行从npm官方源拖代码时会遇上麻烦。请先将npm仓库源替换为国内镜像:
npm config set registry https://registry.npm.taobao.org
npm config set disturl https://npm.taobao.org/dist
或者
sudo gedit /home/xuzhifan/.npmrc(/你的主目录/.npmrc)
编辑文件输入
registry = http://registry.npm.taobao.org
disturl = https://npm.taobao.org/dist
8、如何运行从github上下载 的react native开源项目
(1)、进入项目目录
(2)、npm install (为项目增加node_modules文件夹)
(3)、react-native start(开启服务)
(4)、react-native run-android(安装并运行程序)
9、遍历json数据,动态添加html元素
render: function() {
return (
<ol>
{
React.Children.map(this.props.children, function (child) {
return <li>{child}</li>;
})
}
</ol>
);
}