UNPKG

febs-react-component

Version:

> A component framework for React Native / React Web.

87 lines (58 loc) 1.89 kB
# Febs React Component > A component framework for React Native / React Web. [![NPM](https://nodei.co/npm/febs-react-component.png?downloads=true&downloadRank=true&stars=true)](https://nodei.co/npm/febs-react-component/) # Install Use npm to install: ```js npm install febs-react-component --save ``` It will copy directory `node_modules/febs-react-component` to `node_modules/react-component` # Example see the files in path: ./demo/*.* ```js import React, { Component } from 'react'; import { AppRegistry, StyleSheet, } from 'react-native'; import { Navigator } from '../index' class app extends Component { render() { return ( <Navigator ref='nav' defaultTitle={{ text: 'Title', }} defaultLeftButton={{ text: 'Back', }} defaultRightButton={{ text: 'Forward', onPress:()=>this.refs.nav.pop() }} defaultBarTintColor='#2112' configureScene={(route, routeStack) => Navigator.SceneConfigs.FloatFromBottom} initialRoute={{ title: {text: 'My Initial Scene'}, component:Page // Page中可以使用 props. 来操作. }} /> ); } } const styles = StyleSheet.create({}); AppRegistry.registerComponent('app', () => app); ``` # React Native/Web compatible see [demo](./demo). ## Components * AlertView ![](demo/ui/alertView.jpg) ![](demo/ui/loadding.jpg) ![](demo/ui/toast.jpg) * Button ![](demo/ui/button.jpg) * Icons ![](demo/ui/icons.jpg) * Navigator ![](demo/ui/nav.jpg) * Page ![](demo/ui/page.jpg) * RefreshListView (from npm) * RefreshScrollView (from npm) * TableViewCell ![](demo/ui/tableViewCell.jpg) * TimerMgr timer管理; 可以在页面销毁时自动销毁存在的timer 统一封装 requestAnimationFrame / cancelAnimationFrame 方法