/*
|
* @Company: hugeInfo
|
* @Author: ldh
|
* @Date: 2022-08-20 19:25:50
|
* @LastEditTime: 2024-01-19 11:24:16
|
* @LastEditors: lwh
|
* @Version: 1.0.0
|
* @Description: 我的“tabs”组件
|
*/
|
import React from 'react';
|
import './index.less';
|
|
const MyTabsHeads = ({ tabs = [], activeKey, onChange, keyStr = ['key', 'title'] }) => {
|
return (
|
<div className="myTabs-heads">
|
{tabs.map((x, t) => {
|
return (
|
<div
|
onClick={() => onChange(x[keyStr[0]] || t)}
|
key={x[keyStr[0]] || t}
|
className={`myTabs-heads-tab ${activeKey === (x[keyStr[0]] || t) ? 'myTabs-heads-active' : ''}`}
|
>
|
<div className="myTabs-heads-img">{activeKey === (x[keyStr[0]] || t) ? x.iconActive : x.icon}</div>
|
<div className="myTabs-heads-title">{x[keyStr[1]]}</div>
|
</div>
|
);
|
})}
|
</div>
|
);
|
};
|
|
export default MyTabsHeads;
|