@ant-design/react-native/lib/tab-bar/demo/basic.js

基于蚂蚁金服移动设计规范的 React Native 组件库

"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../");function _createSuper(Derived){var hasNativeReflectConstruct=_isNativeReflectConstruct();return function _createSuperInternal(){var Super=(0,_getPrototypeOf2["default"])(Derived),result;if(hasNativeReflectConstruct){var NewTarget=(0,_getPrototypeOf2["default"])(this).constructor;result=Reflect.construct(Super,arguments,NewTarget);}else{result=Super.apply(this,arguments);}return(0,_possibleConstructorReturn2["default"])(this,result);};}function _isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));return true;}catch(e){return false;}}var BasicTabBarExample=function(_React$Component){(0,_inherits2["default"])(BasicTabBarExample,_React$Component);var _super=_createSuper(BasicTabBarExample);function BasicTabBarExample(props){var _this;(0,_classCallCheck2["default"])(this,BasicTabBarExample);_this=_super.call(this,props);_this.state={selectedTab:'redTab'};return _this;}(0,_createClass2["default"])(BasicTabBarExample,[{key:"renderContent",value:function renderContent(pageText){return _react["default"].createElement(_reactNative.View,{style:{flex:1,alignItems:'center',backgroundColor:'white'}},_react["default"].createElement(_.SearchBar,{placeholder:"Search",showCancelButton:true}),_react["default"].createElement(_reactNative.Text,{style:{margin:50}},pageText));}},{key:"onChangeTab",value:function onChangeTab(tabName){this.setState({selectedTab:tabName});}},{key:"render",value:function render(){var _this2=this;return _react["default"].createElement(_.TabBar,{unselectedTintColor:"#949494",tintColor:"#33A3F4",barTintColor:"#f5f5f5"},_react["default"].createElement(_.TabBar.Item,{title:"Life",icon:_react["default"].createElement(_.Icon,{name:"home"}),selected:this.state.selectedTab==='blueTab',onPress:function onPress(){return _this2.onChangeTab('blueTab');}},this.renderContent('Life Tab')),_react["default"].createElement(_.TabBar.Item,{icon:_react["default"].createElement(_.Icon,{name:"ordered-list"}),title:"Koubei",badge:2,selected:this.state.selectedTab==='redTab',onPress:function onPress(){return _this2.onChangeTab('redTab');}},this.renderContent('Koubei Tab')),_react["default"].createElement(_.TabBar.Item,{icon:_react["default"].createElement(_.Icon,{name:"like"}),title:"Friend",selected:this.state.selectedTab==='greenTab',onPress:function onPress(){return _this2.onChangeTab('greenTab');}},this.renderContent('Friend Tab')),_react["default"].createElement(_.TabBar.Item,{icon:_react["default"].createElement(_.Icon,{name:"user"}),title:"My",selected:this.state.selectedTab==='yellowTab',onPress:function onPress(){return _this2.onChangeTab('yellowTab');}},this.renderContent('My Tab')));}}]);return BasicTabBarExample;}(_react["default"].Component);exports["default"]=BasicTabBarExample;