eui-tab

eui tab component

Usage

import React from 'react';
import ReactDOM from 'react-dom';
import { Tabs, TabPane }  from 'eui-tab';
function callback(key) {
   console.log(key);
}

ReactDOM.render(
      <Tabs defaultActiveKey="1" onChange={callback}>
            <TabPane tab="tab1" key="1">tab1 content</TabPane>
            <TabPane tab="tab2" key="2">tab2content</TabPane>
            <TabPane tab="tab3" key="3">tab3 content</TabPane>
      </Tabs>,
    document.getElementById('app')
);

API

Tabs

keys | type |default | description ---|---|---|--- activeKey|String|null|当前激活选项key defaultActiveKey|String|first active tabPane key | 设置默认选项 onChange|function( key:String) :void|切换回调 disabled | Boolean| false|是否禁用该选项 tabBarExtraContent|React Node||额外的元素 在tab右侧 type|line、card|line |选项卡模式 是否选择卡片模式

TabPane

keys | type |default | description ---|---|---|--- key|Object||当前激活key 唯一 tab |React.Node或者String| null |tab选项标题显示内容