zarm-web/es/tabs/Tab.js

基于 React 的桌面端UI库

import React, { Component } from 'react';
import classnames from 'classnames';

class Tab extends Component {
  static getDerivedStateFromProps(props) {
    if ('selected' in props) {
      return {
        selected: !!props.selected
      };
    }

    return null;
  }

  constructor(props) {
    super(props);
    this.state = {
      selected: props.selected || props.defaultSelected
    };
  }

  render() {
    const {
      className,
      children,
      style,
      prefixCls
    } = this.props;
    const {
      selected
    } = this.state;
    const cls = classnames(className, `${prefixCls}__body__item`, {
      [`${prefixCls}__body__item--active`]: selected
    });
    return React.createElement("div", {
      className: cls,
      style: style
    }, children);
  }

}

Tab.displayName = 'Tab';
Tab.defaultProps = {
  prefixCls: 'zw-tabs'
};
export default Tab;