這裡以android為例子(ios同理)
首先我們來看android的入口檔案index.android.js檔案
**如下:
/**
* * @flow
*/
import
react,
from
'react';
import
from
'react-native';
import
setupcomponent
from
'./js/setupcomponent'; //這裡是引入react 元件
registercomponent(
=>
setupcomponent);
2.然後我們來看看引入的這個setupcomponent這個js裡面的元件
**如下:
/**
* * @flow
*/
import
react,
from
'react';
import
from
'react-native';
import
elcomponent,
from
'./elcomponent';
//看到這裡我們又在當前js裡面匯入了elcomponent並匯入了name跟age兩個值過來
export
default
class
setupcomponent
extends
component
>
<
text
style=
>
名字:,年齡:
text
>
view
>
); }
}const
styles =
stylesheet.
create(,
welcome: ,
});registercomponent(
=>
3.同理我們看看
elcomponent
**如下:
/**
* * @flow
*/import
react,
from
'react';
import
from
'react-native';
//從這個頁面匯出資料
varname=
"張三";
varage=
18;export ;
//這個就是把name跟age變數匯出到下乙個頁面 給下乙個頁面使用
export
default
class
elcomponent
extends
component
>
<
text
style=
>
text
>
view
>
);}
}
const
styles =
stylesheet.
create(,
welcome: ,
});
registercomponent(
=>
4.我們看下專案的執行結果
React Native 爬坑之路
1.react 基礎 建立元件及在瀏覽器上渲染元件 2.設定元件樣式 3.復合元件 4.props 傳值 5.state管理 及 事件繫結 6.react 生命週期 7.index.android.js 詳解 flow 第一部分 匯入reactnative包,匯入reactnative元件 styl...
react native學習資源
這是我覺得比較有用的學習資源 要多練習多理解 一 1.react native 官方api文件 2.react native中文文件 3.react native通訊機制詳解 4.react native布局篇 5.react native基礎指南 一 6.react native基礎指南 二 7....
React Native學習 起步
時間 2015 04 11 10 32 49 w3ctech 原文 主題react 本指南匯集react native各類學習資源,給大家提供便利。指南正在不斷的更新,大家有好的資源歡迎pull requests!同時還有awesome react native系列 研究原始碼也是乙個很好的學習方式...