REACT NATIVE 系列教程之三函数绑定与FLEXBOX是用好REACT的基础
Posted 李华明Himi
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了REACT NATIVE 系列教程之三函数绑定与FLEXBOX是用好REACT的基础相关的知识，希望对你有一定的参考价值。
本站文章均为 李华明Himi 原创,转载务必在明显处注明：转载自【黑米GameDev街区】 原文链接: http://www.himigame.com/react-native/2222.html
width="150" height="210" frameborder="0" scrolling="no" src="http://widget.weibo.com/relationship/bulkfollow.php?language=zh_cn&uids=1916000601&wide=1&color=FFFFFF,FFFFFF,0082CB,666666&showtitle=0&showinfo=1&sense=0&verified=1&count=1&refer=http%3A%2F%2Fwww.himigame.com%2Freact-native%2F2222.html&dpc=1" style="margin: 0px; padding: 0px; border-width: 0px; font-family: inherit;font-size:undefined; font-style: inherit; font-variant-caps: inherit; line-height: inherit; max-width: 100%;">
Himi在写React 时主要遇到两个知识点觉得很有必要跟大家一起回顾下。
- 函数绑定
- FlexBox 布局
一：函数绑定
首先来看一段代码片段：
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | constructor ( props ) super ( props ) ; this . state = myName : 'I am MyName!' , ; componentWillMount ( ) this . state . myName = 'cwm' ; testFun1 ( ) this . state . myName = 'tf1' ; Alert . alert ( 'Himi' , ' testFun1 ' ) ; testFun2 ( ) Alert . alert ( 'Himi' , ' testFun2 ' ) ; |
在state中声明了myName
constructor: 组件的构造函数
componentWillMount ： 组件预加载前调用的生命周期函数
testFun1、 testFun2 ：是两个自定义的函数。
继续看render中的一段：
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<
TouchableHighlight
underlayColor
=
'#4169e1'
onPress
=
this
.
testFun1
>
<
Image
source
=
require
(
'./res/himi.png'
)
style
=
width
:
70
,
height
:
70
/
>
<
/
TouchableHighlight
>
<
TouchableHighlight
underlayColor
=
'#4169e1'
onPress
=
this
.
testFun2
>
<
Image
source
=
require
(
'./res/himi.png'
)
style
=
width
:
70
,
height
:
70
/
>
以上是关于REACT NATIVE 系列教程之三函数绑定与FLEXBOX是用好REACT的基础的主要内容，如果未能解决你的问题，请参考以下文章 REACT NATIVE 系列教程之九REACT NATIVE版本升级步骤与注意事项！ REACT NATIVE 系列教程之十二REACT NATIVE(JS/ES)与IOS(OBJECT-C)交互通信 REACT NATIVE 系列教程之十一插件的安装使用与更新(示例:REACT-NATIVE-TAB-NAVIGATOR) REACT NATIVE 系列教程之十一插件的安装使用与更新(示例:REACT-NATIVE-TAB-NAVIGATOR) |