ReactNative学习笔记

原创
2017/03/22 15:29
阅读数 92

标题

#IDE选择了WebStorm

解决import时can not resolve symbol的问题

clipboard.png
需要做个配置 clipboard.png

智能提示&代码块

ReactNative-LiveTemplate jetbrains-react

#0.39.1bug 用0.38先,等待官方修复

react-native init projectName --version 0.38.0

#布局样式 ##flexDirection 决定主轴方向

  • column:垂直方向为主轴
  • row:水平方向为主轴 ##justifyContent 决定主轴元素排列方式
  • flex-start
  • flex-end
  • center
  • space-between
  • space-around ##alignItems 决定侧轴元素排列方向
  • flex-start
  • flex-end
  • center
  • baseline
  • stretch

#Redux Redux 中文文档 ###创建actionTypes 一般都是一些常量,方便在action和reducer中统一使用 ###创建action 返回带有actionTypes和返回数据的函数; dispatch的时候,作为参数传入 ###创建reducer 根据action中返回的actionTypes和数据,对变更store中的state ###创建store

  1. applyMiddleware,将Middleware加载到createStore方法中
  2. createStoreWithMiddleware,将reducers传入。让Store接到什么命令的时候应该干啥

###Provide 使用Provide对root组件进行包装,传入创建好的store,让我们的组件可以感知到Store的存在并使用 ###connect 让我们的组件和Store链接起来

  1. 把Store中的state关联到组件的props里,让我们可以调用Store中的数据
  2. 把dispatch(actionMethod(params))关联到组件的props里面,让我们可以对Store下命令

###个人理解

action:处理加工,生成对Store的命令及详情
dispatch:对Store发送命令及详情
reducer:对于收到命令,根据详情,对Store进行实质性的变更

#UI库 NativeBase
Shoutem UI
React Native Elements UI Toolkit
Ant Design Mobile ###参考文章 Redux 核心概念:http://www.jianshu.com/p/3334467e4b32
在react-native中使用redux:http://www.jianshu.com/p/2c43860b0532

展开阅读全文
打赏
0
1 收藏
分享
加载中
打赏
0 评论
1 收藏
0
分享
返回顶部
顶部