自己建立的元件：程式碼

import { Table, Divider, Tag } from 'antd';
import React, { Component } from 'react';
export default class My_Table extends Component {
	render() {
    const columns = [{
      title: 'Name',
      dataIndex: 'name',
      key: 'name',
      render: text => <a href="javascript:;">{text}</a>,
    }, {
      title: 'Tags',
      key: 'tags',
      dataIndex: 'tags',
      render: tags => (
        <span>
          {tags.map(tag => <Tag color="blue" key={tag}>{tag}</Tag>)}
        </span>
      ),
    }, {
      title: 'Action',
      key: 'action',
      render: (text, record) => (
        <span>
          <a href="javascript:;">Invite {record.name}</a>
          <Divider type="vertical" />
          <a href="javascript:;">Delete</a>
        </span>
      ),
    }];
    
    const data = [{
      key: '1',
      name: 'John Brown',
      age: 32,
      address: 'New York No. 1 Lake Park',
      tags: ['nice', 'developer'],
    }, {
      key: '2',
      name: 'Jim Green',
      age: 42,
      address: 'London No. 1 Lake Park',
      tags: ['loser'],
    }];
    return(<Table columns={columns} dataSource={data} />);
  }
}
 

同文件目錄下的引用程式碼：

import React, { Component } from 'react';

import My_Table from './list_detail';
export default class import_test extends Component {
	render() {
   
    return(<My_Table/>);
  }
}

元件class命名必須大寫開頭！！！！  重要！！！！