ReactNative github 模拟项目记录

创建项目

命令：cd xxxx 目录
react-native init 工程名字
用webstrom打开

知识点记录：

• 当属性为一个组价类型的时候，如果在使用次组件的时候如果没有这个属性值，则会报错，这时候需要为其制定类型PropTypes.element，加入有个navBtn属性：

static propTypes = {
        rightBtn: PropTypes.element,
    }

• 在使用Navigator的时候新版的RN会报错：

ExceptionsManager.js:63 Navigator is deprecated and has been removed 
from this package. It can now be installed and imported from `react-native-
deprecated-custom-components` instead of `react-native`. Learn about 
alternative navigation solutions at http://facebook.github.io/react-
native/docs/navigation.html

• 如果按照他的解决方案导入‘react-native-
  deprecated-custom-component’后任然会报错
• 使用新的Navigator ， 参考地址：https://reactnavigation.org/docs/intro/
  ，http://blog.csdn.net/u013147860/article/details/68926816

• 发现一个很奇怪的现象当我使用Navigation的时候，无论是使用navigator进行跳转：

const {navigate} = this.props.navigation;
        return 
            
             navigate('CustomKey',{name:'自定义标签'})}>自定义标签
        

还是取值navigator从上一个页面跳转过来的值的时候：

const {params} = this.props.navigation.state;
        return 
            
            {params.name}
        

都必须是这种写法，如果是这种将取不到值的：

return 
            
            {this.props.navigation.state.name}
        

• Navigation返回的话用navigation.goBack(null)；方法

• 当我们放置了视图而没有看到相应的效果的时候，往往是视图没有设置相应的宽高，或者fex:1

• 当一个回调函数不需要传参数的时候可以直接把函数名赋值给回调属性，如果需要传递参数的话，就需要函数后面带有括号，这样的话就变成调用函数了，这时候需要箭头函数来包裹

• Object.keys(arr) 会返回数组包含数组所有的下标值，或者一个对象的所有的属性

• 在render()函数的return 中 返回的组件一定要和return在同一行，否则没有效果。

• forceUpdate()强制重新渲染

资料

https://github.com/expo/react-native-tab-navigator
npm install react-native-tab-navigator --save
http://blog.csdn.net/jing85432373/article/details/54342756

npm install --save react-navigation

• 复选框react-native-check-box
  https://github.com/crazycodeboy/react-native-check-box
  npm i react-native-check-box --save（两个横杠，我的mac电脑，不要复制我的）
  npm install react-native-vector-icons --save

• tabView控件
  npm install react-native-scrollable-tab-view --save

• Toast:
  npm i react-native-easy-toast --save
  import Toast, {DURATION} from 'react-native-easy-toast'
  https://github.com/crazycodeboy/react-native-easy-toast

• 可排序的listview
  npm install react-native-sortable-listview --save
  https://github.com/deanmcpherson/react-native-sortable-listview

• github开放api
  https://api.github.com/search/repositories?q=${key}&sort=stars

• 获取github Trending的列表的项目：
  https://github.com/crazycodeboy/GitHubTrending

• 解决启动页空白页的问题
  react-native-splash-screen*

碰到的问题：

我在mac上前一天盖上盖子后，react的服务挂起了，第二天在引用项目的时候回报错：找不到这个模块，但是明明有啊，点进去还是也有代码联想啊！关掉重启就好了。

待研究的——Navigation

• http://blog.csdn.net/u013147860/article/details/68926816
• https://reactnavigation.org/docs/intro/
• http://blog.csdn.net/sinat_17775997/article/details/70861065
• http://www.jianshu.com/p/2ce08b92cf60