- 博客(6)
- 收藏
- 关注
原创 06.使用Flexbox布局
1.一般来说,使用flexDirection,alignItems状语从句: justifyContent三个样式属性就已经能满足大多数布局需求。 1.1Flex方向 在组件的style中指定flexDirection可以决定布局的主轴。子元素是应该沿着水平轴(row)方向排列,还是沿着竖直轴(column)方向排列呢?默认值是竖直轴(column)方向。这句话的意思是父组件fle...
2018-10-17 18:28:31 212
原创 05 flex弹性布局
1.指定宽高 最简单的给组件设定尺寸的方式就是在样式中指定固定的width和height。React Native 中的尺寸都是无单位的,表示的是与设备像素密度无关的逻辑像素点。 import React, { Component } from 'react'; import { AppRegistry, View } from 'react-native'; export default...
2018-10-17 09:18:29 174
原创 04.style样式
在 React Native 中,你并不需要学习什么特殊的语法来定义样式。我们仍然是使用 JavaScript 来写样式。所有的核心组件都接受名为style的属性。这些样式名基本上是遵循了 web 上的 CSS 的命名,只是按照 JS 的语法要求使用了驼峰命名法,例如将background-color改为backgroundColor。 style属性可以是一个普通的 JavaScript 对象...
2018-10-16 17:16:24 305
转载 03.state属性
我们使用两种数据来控制一个组件:props和state。props是在父组件中指定,而且一经指定,在被指定的组件的生命周期中则不再改变。 对于需要改变的数据,我们需要使用state。 一般来说,你需要在 constructor 中初始化state(译注:这是 ES6 的写法,早期的很多 ES5 的例子使用的是 getInitialState 方法来初始化 state,这一做法会逐渐被淘汰),然后...
2018-10-16 17:06:51 198
原创 02.Props属性
此属性类似于oc中.h文件中的属性,它和state共同来决定UI的绘制 例子:自定义的组件也可以使用props。通过在不同的场景使用不同的属性定制,可以尽量提高自定义组件的复用范畴。只需在render函数中引用this.props,然后按需处理即可。下面是一个例子: import React, { Component } from 'react'; import { Text, View }...
2018-10-16 14:58:11 180
转载 01.ES5和ES6对照表
前言: 很多React/React Native的初学者都被ES6的问题迷惑:各路大神都建议我们直接学习ES6的语法(class Foo extends React.Component),然而网上搜到的很多教程和例子都是ES5版本的,所以很多人在学习的时候连照猫画虎都不知道怎么做。今天在此整理了一些ES5和ES6的写法对照表,希望大家以后读到ES5的代码,也能通过对照,在ES6下实现相同的功能...
2018-10-16 14:50:53 179
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人