yylib-quick-mobile/dist/yylib/accordion/YYAccordionDev.js

yylib-quick-mobile

import React, {Component} from 'react';
import {Accordion, List} from 'antd-mobile';
import classnames from 'classnames';
import './YYAccordion.less';
import {isFunction} from '../../utils/FunctionUtil';
class YYAccordionDev extends Component {
  constructor(props) {
    super(props);
    this.state = {
      activeKey: props.expandAll?this.getKey():['0']
    };
  }
  onChange = (e) => {
    this.setState({activeKey:e});
    if (isFunction(this.props.onChange)) {
      setTimeout(()=>{
        this.props.onChange(e);
      },300);
    }
  }
  getKey() {
    let {children}=this.props;
    children = (children&&children.constructor==Array)?children:[children];
    let keys = [];
    children&&children.map((item,index)=>{
      keys.push(String(index));
    });
    return keys;
  }
  getAccordionPanel(){
      let {children,...restProps}=this.props;
      if(children){
        Array.prototype.slice.call(children);
        children = (children&&children.constructor==Array)?children:[children];
          return  children.map((item,index)=>{
            let {uititle,badge,icon,selectedIcon,iconColor,selectedIconColor,dot,selected,nid,children:child}=item.props;
            return(
              <Accordion.Panel
                {...restProps}
                header={uititle}
                key={index}
              >
              {child}
              </Accordion.Panel>
            );
         })
      }
      return  [];
  }
  componentWillReceiveProps(nextprops){
    this.setState({
      activeKey: nextprops.expandAll?this.getKey():['0']
    });
  }
  render() {
    let {mode,visible,children,...restProps} = this.props;
    let wrapClz = classnames('yy-accordion',(!visible&&'hidden'), this.props.className);
    return (
      <Accordion
        {...restProps}
        accordion={mode==='accordion'?true:false}
        defaultActiveKey={this.state.activeKey}
        activeKey={this.state.activeKey}
        className={wrapClz}
        onChange={this.onChange}>
        {this.getAccordionPanel()}
      </Accordion>
    );
  }
}
YYAccordionDev.defaultProps = {
  visible: true,
}
export default YYAccordionDev;