Google Blog 10/12/2016 (p.m.)

• 使用Flexbox布局 - react native 中文网

  • flexbox规则来指定某个组件的子元素的布局
  • 在不同屏幕尺寸上提供一致的布局结构
  • flexDirection的默认值是column而不是row

• 高度与宽度 - react native 中文网

  • 表示的是与设备像素密度无关的逻辑像素点
  • React Native中的尺寸都是无单位
  • 注册应用(registerComponent)后才能正确渲染 // 注意：只把应用作为一个整体注册一次，而不是每个组件/模块都注册
  • 在不同尺寸的屏幕上都显示成一样的大小
  • 在可利用的空间中动态地扩张或收缩
  • 一般而言我们会使用flex:1来指定某个组件扩张以撑满所有剩余的空间
  • 即占据剩余空间的比等于并列组件间flex值的比
  • 如果父容器既没有固定的width和height，也没有设定flex
    • 尺寸为0
  • 父容器的尺寸为零。其子组件如果使用了flex，也是无法显示的。

• 样式 - react native 中文网

  • 所有的核心组件都接受名为style的属性
  • 按照JS的语法要求使用了驼峰命名法
  • 在数组中位置居后的样式对象比居前的优先级更高
  • 我们建议使用StyleSheet.create来集中定义组件的样式。
  • 即后声明的属性会覆盖先声明的同名属性
    • 后面会覆盖了前面的

• State（状态） - react native 中文网

  • 两种数据来控制一个组件：props和state
  • 生命周期中则不再改变
    • props在生命周期内不会改变,需要改变的数据,我们需要用state来存储
  • 对于需要改变的数据，我们需要使用state
  • 典型的场景是在接收到服务器返回的新数据，或者在用户输入数据之后。你也可以使用一些“状态容器”比如Redux来统一管理数据流
  • 但我们不建议新手过早去学习redux）。

• Props（属性） - react native 中文网

  • 大多数组件在创建时就可以使用各种参数来进行定制
  • 括号的意思是括号内部为一个js变量或表达式，需要执行后取值
  • 自定义的组件也可以使用props

• 编写Hello World - react native 中文网

  • 无需担心兼容性问题
  • JSX——是一种在JavaScript中嵌入XML结构的语法
  • 上面的代码定义了一个名为HelloWorldApp的新的组件（Component），并且使用了名为AppRegistry的内置模块进行了“注册”操作
  • 一个App的最终界面，其实也就是各式各样的组件的组合
  • 在render方法中返回一些用于渲染结构的JSX语句
  • 一般在整个应用里AppRegistry.registerComponent这个方法只会调用一次
  • AppRegistry模块则是用来告知React Native哪一个组件被注册为整个应用的根容器。

Posted from Diigo. The rest of my favorite links are here.