How to use the @alifd/next.Tab.Item function in @alifd/next

/* eslint react/no-string-refs:0 */
import React, { Component } from 'react';
import IceContainer from '@icedesign/container';
import { Tab } from '@alifd/next';
import LibTable from './LibTable';
import BorrowTable from './BorrowTable';

const TabPane = Tab.Item;

const tabs = [
  { tab: '全部图书', key: '1', content:  },
  { tab: '借阅信息', key: '2', content:  },
];

export default class DonationForm extends Component {
  static displayName = 'DonationForm';

  static propTypes = {};

  static defaultProps = {};

  constructor(props) {
    super(props);
    this.state = {};

UI: {
    version: '1.x',
    Button,
    Accordion: Collapse,
    Toast: Message,
    Upload,
    Input,
    Select,
    Icon,
    DatePicker,
    TimePicker,
    Checkbox,
    NumberPicker,
    Radio,
    RadioGroup: Radio.Group,
    TabPane: Tab.Item,
    Form,
    Tab
  },
  // 主题： dark/light,默认dark
  themeStyle: 'dark',
  // 是否展示布局组件，默认为false
  showLayoutField: true,
  // 是否展示预览按钮，默认为true
  showPreviewBtn: true,
  // 是否展示源码按钮
  showSourceCodeBtn: true,
  // 控制返回按钮点击事件
  onBackBtnClick: () => {
    alert('点击了返回')
  },
  // 额外全局按钮

import React, { Component } from 'react';
import IceContainer from '@icedesign/container';
import { Tab } from '@alifd/next';
import SeriesLine from './SeriesLine';
import BasicLine from './BasicLine';

const TabPane = Tab.Item;

export default class TabChart extends Component {
  static displayName = 'TabChart';

  static propTypes = {};

  static defaultProps = {};

  constructor(props) {
    super(props);
    this.state = {};
  }

  handleChange = (key) => {
    console.log('change', key);
  };

import React from 'react'; 
import { Balloon, Button, Checkbox, Dialog, Field, Form, Icon, Input, Loading, Radio, Select, Switch, Tab } from '@alifd/next';
const TabPane = Tab.Item; 
const FormItem = Form.Item; 
const { Group: CheckboxGroup } = Checkbox; 
const { Group: RadioGroup } = Radio; 
const { AutoComplete: Combobox } = Select;
import DiffEditorDialog from '../components/DiffEditorDialog' ;
import SuccessDialog from '../components/SuccessDialog' ;

/*****************************此行为标记行, 请勿删和修改此行, 文件和组件依赖请写在此行上面, 主体代码请写在此行下面的class中*****************************/
class EdasConfigeditor extends React.Component {
    constructor(props) {
        super(props);
        this.edasAppName = getParams('edasAppName') || '';
        this.edasAppId = getParams('edasAppId') || '';
        this.inApp = this.edasAppName;
        this.field = new Field(this);
        this.dataId = getParams('dataId') || 'yanlin';

import React from 'react';
import IceContainer from '@icedesign/container';
import { Tab } from '@alifd/next';
import LineChart from './LineChart';
import Head from './Head';
import './PerformanceChart.scss';
import styles from './index.module.scss';

const TabPane = Tab.Item;

const MOCK_DATA = {
  all: {
    day: '677.00',
    month: '3621.00',
    target: '10000.00',
    percent: '30',
  },
  online: {
    day: '1286.00',
    month: '2836.00',
    target: '5000.00',
    percent: '61',
  },
  offline: {
    day: '892.00',

import React, { Component } from 'react';
import { Tab } from '@alifd/next';
import SmallCard from './../../../../components/SmallCard';

const TabPane = Tab.Item;

export default class Tabs extends Component {
  static displayName = 'Tabs';

  state = {
    data: this.props.data,
  };

  handleTab = (item) => {
    let newData = [];
    if (item.tab === '自建' || item.tab === '共享') {
      newData.push(this.props.data[0]);
    } else if (item.tab === '预置') {
      newData.push(this.props.data[1]);
    } else {
      newData = this.props.data;

import React, { useState } from 'react';
import { Dialog, Tab, Table, Button } from '@alifd/next';
import IceContainer from '@icedesign/container';
import styles from './index.module.scss';

const TabPane = Tab.Item;

const mockData = [
  {
    title: '十九大后，习近平对中国经济给出8大论断',
    id: '1212',
  },
  {
    title: '中驻美使馆:美《国家安全战略报告》自相矛盾',
    id: '231',
  },
  {
    title: '美发国安战略:坚持"一中政策" 继续对台军售',
    id: '2321',
  },
  {
    title: '又一"港独"组织濒于溃散:召集人潜逃 发言人退伙',

import React from 'react'; 
import { Button,  Dialog, Field, Form, Icon, Input, Loading, Switch, Tab } from '@alifd/next';
const TabPane = Tab.Item; 
const FormItem = Form.Item; 

/*****************************此行为标记行, 请勿删和修改此行, 文件和组件依赖请写在此行上面, 主体代码请写在此行下面的class中*****************************/
class EdasConfigdetail extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            loading: false,
            showmore: false,
            activeKey: 'normal',
            hasbeta: false,
            ips: '',
            checkedBeta: false,
            switchEncrypt: false,
            tag: [{ title: aliwareIntl.get('com.alibaba.cspupcloud.page.configdetail.official'), key: 'normal' }]
        };