Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/vczero/react-native-tab-menu
React Native 二级菜单组件
https://github.com/vczero/react-native-tab-menu
Last synced: 2 months ago
JSON representation
React Native 二级菜单组件
- Host: GitHub
- URL: https://github.com/vczero/react-native-tab-menu
- Owner: vczero
- License: mit
- Created: 2015-09-16T04:35:38.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2015-09-16T15:30:35.000Z (over 9 years ago)
- Last Synced: 2024-10-29T13:49:38.514Z (3 months ago)
- Language: JavaScript
- Homepage:
- Size: 210 KB
- Stars: 180
- Watchers: 4
- Forks: 35
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-react-native - react-native-tab ★171 - react-native-tab is a simple module for add a "Tab Menu" to your React Native app. (Components / UI)
README
# react-native-tab
react-native-tab is a simple module for add a "Tab Menu" to your React Native app.
### Features
### Usage
npm install react-native-tab
##### Demo1:
var React = require('react-native');
var MenuList = require('react-native-tab');
var {
AppRegistry,
StyleSheet,
Text,
View,
ScrollView,
TouchableOpacity,
} = React;
var data = {
"Language": {
"All": ["All"],
"Web Front End": [
"HTML",
"CSS",
"JavaScript"
],
"Server": [
"Node.js",
"PHP",
"Python",
"Ruby"
]
},
"Tool":{
"All": ["All"],
"Apple": ["Xcode"],
"Other": ["Sublime Text", "WebStrom",]
}
};
var App = React.createClass({
render: function(){
return (
);
},
onPress: function(val){
alert(val);
}
});
AppRegistry.registerComponent('app', () => App);
##### Demo2:
var React = require('react-native');
var MenuList = require('react-native-tab');
var {
AppRegistry,
StyleSheet,
Text,
View,
ScrollView,
TouchableOpacity,
} = React;
var data = {
"全部区域": {
"全部区域": ["全部区域"],
"热门商圈": [
"虹桥地区",
"徐家汇地区",
"淮海路商业区",
"静安寺地区",
"上海火车站地区",
"浦东陆家嘴金融贸易区",
"四川北路商业区",
"人民广场地区",
"南翔、安亭汽车城"
],
"热门行政区": [
"静安区",
"徐汇区",
"长宁区",
"黄埔区",
"虹口区",
"宝山区",
"闸北区"
]
},
"地铁沿线":{
"地铁全线": ["地铁全线"],
"一号线": ["莘庄站", "外环路站", "莲花路站", "锦江乐园站", "上海南站站", "漕宝路站"],
"二号线": ["浦东国际机场站", "海天三路站", "远东大道站", "凌空路站"]
}
};
var App = React.createClass({
render: function(){
return (
);
},
onPress: function(val){
alert(val);
}
});
AppRegistry.registerComponent('app', () => App);
### Properties
+ data: 你需要渲染的数据，格式参见demo。
+ tabSelected: 默认选中第几个tab，number类型。
+ nSelected: 默认选中tab下的二级菜单项，number类型。