antd-mobile/lib/tab-bar/index.web.js

基于 React 的移动设计规范实现

'use strict';

Object.defineProperty(exports, "__esModule", {
    value: true
});

var _react = require('react');

var React = _interopRequireWildcard(_react);

var _rcTabs = require('rc-tabs');

var _rcTabs2 = _interopRequireDefault(_rcTabs);

var _Tab = require('./Tab.web');

var _Tab2 = _interopRequireDefault(_Tab);

var _TabContent = require('rc-tabs/lib/TabContent');

var _TabContent2 = _interopRequireDefault(_TabContent);

var _TabBar = require('rc-tabs/lib/TabBar');

var _TabBar2 = _interopRequireDefault(_TabBar);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj["default"] = obj; return newObj; } }

var AntTabBar = React.createClass({
    displayName: 'AntTabBar',

    statics: {
        Item: function Item() {}
    },
    getDefaultProps: function getDefaultProps() {
        return {
            prefixCls: 'am-tab-bar',
            barTintColor: 'white',
            tintColor: '#108ee9',
            unselectedTintColor: '#888'
        };
    },
    onChange: function onChange(key) {
        React.Children.forEach(this.props.children, function (c) {
            if (c.key === key && c.props.onPress) {
                c.props.onPress();
            }
        });
    },
    renderTabBar: function renderTabBar() {
        var props = this.props;

        return React.createElement(_TabBar2["default"], { onTabClick: props.onTabClick, style: { backgroundColor: props.barTintColor } });
    },
    renderTabContent: function renderTabContent() {
        return React.createElement(_TabContent2["default"], { animated: false });
    },
    render: function render() {
        var _this = this;

        var activeKey = void 0;
        var children = [];
        React.Children.forEach(this.props.children, function (c) {
            if (c.props.selected) {
                activeKey = c.key;
            }
            children.push(c);
        });
        var _props = this.props;
        var tintColor = _props.tintColor;
        var unselectedTintColor = _props.unselectedTintColor;

        var panels = children.map(function (c) {
            var cProps = c.props;
            var tab = React.createElement(_Tab2["default"], { prefixCls: _this.props.prefixCls + '-tab', badge: cProps.badge, selected: cProps.selected, icon: cProps.icon, selectedIcon: cProps.selectedIcon, title: cProps.title, tintColor: tintColor, unselectedTintColor: unselectedTintColor });
            return React.createElement(
                _rcTabs.TabPane,
                { placeholder: '正在加载', tab: tab, key: c.key },
                cProps.children
            );
        });
        return React.createElement(
            _rcTabs2["default"],
            { renderTabBar: this.renderTabBar, renderTabContent: this.renderTabContent, tabBarPosition: 'bottom', prefixCls: this.props.prefixCls, activeKey: activeKey, onChange: this.onChange },
            panels
        );
    }
});
exports["default"] = AntTabBar;
module.exports = exports['default'];