React Native組件化介紹

  • React Native的核心思想就是組件化，相當于MVC的view,因此開發(fā)應用的最佳方式就是將功能組件化
  • 組件化最大的優(yōu)點可以使Android和iOS能夠很方便地用很少地代碼使用同一套組件，增加代碼的復用性
  • React Native的組件化很簡單，基本步驟如下
    • 引用需要的庫


    // 引用 import React, { Component } from 'react'; import {
        需要用到的組件庫
    } from 'react-native';
    • 實例化視圖入口


    // 實例化視圖入口 // 因為現(xiàn)在還是在想ES6轉化過程中，為了更好的兼容性，這邊使用的是ES5的格式 var 組件名 = React.createClass({
        render(){ return(
                需要實例化的視圖
            );
        }
    });
    • 視圖樣式入口


    // 視圖樣式入口 // 因為現(xiàn)在還是在想ES6轉化過程中，為了更好的兼容性，這邊使用的是ES5的格式 var styles = StyleSheet.create({
        相應視圖的樣式
    });
    • 注冊并輸出組件


    module.exports = 組件名;
  • 生成組件后就可以在ios和android中使用生成后的組件了
    • 引入組件庫


    // 引入組件庫 var 自定義組件名 = require('./組件名');

    網(wǎng)友評論