index.md 1.72 KB
Newer Older
dengxiaofeng's avatar
dengxiaofeng committed
1 2 3 4 5
---
title: 基础组件
nav:
  title: 组件
  order: 1
张烨's avatar
张烨 committed
6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35
---

```jsx
import React from 'react'
import BaseTable from '../../src/components/BaseTable'

const BaseTableDemo = () => {

  const dataSource = [...Array(50).keys()].map(i => ({
    key: i,
    name: `name${i}`,
    age:  (Math.random() * 20 + 18).toFixed(0),
    height: (Math.random() * 20 + 160).toFixed(0)
  }))
  const columns = [{
    title: '序号',
    dataIndex: 'key',
    render: (text, record, index) => {
      return <span> {Number(text) + 1} </span>
    }
  }, {
    title: '姓名',
    dataIndex: 'name',
  }, {
    title: '年龄',
    dataIndex: 'age',
  },{
    title: '身高',
    dataIndex: 'height',
  }]
36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86
  const searchBar = {
  items:[{
    label:'姓名',
    type:'input',
    dataIndex:'name',
    formItemProps:{
      wrapperCol:{
      span:12,
    }}
  },
  {
    label:'年龄',
    type:'input',
    dataIndex:'age',
    formItemProps:{
      wrapperCol:{
      span:12,
    }}
  },
  {
    label:'身高',
    type:'input',
    dataIndex:'height',
    formItemProps:{
      wrapperCol:{
      span:12,
    }}
  },],
  formProps:{
    layout:'inline'
  },
  buttons:[
    {
      text:'搜索',
      type:'primary',
      htmlType:'submit'
    },
    // {
    //   text:'重置',
    //   type:'info',
    //   onClick:handleClick
    // }
  ],

  onCommit: () => {
    console.log(111)
  }
}
  const handleClick =() =>{
    console.log("click")
  }
张烨's avatar
张烨 committed
87 88
  return (
    <BaseTable 
89
      searchBar={searchBar}
张烨's avatar
张烨 committed
90 91 92 93
      // operation={operation}
      dataSource={dataSource}
      columns={columns}
      resizable={true}
94
      bordered={true}
张烨's avatar
张烨 committed
95 96 97 98 99 100 101 102
      // components={components}
      // onRequest={onRequest}
      // onFilter={onFilter}
  />)
}

export default BaseTableDemo
```