1.4.4 • Published 4 months ago

bi-element-ui v1.4.4

Weekly downloads
-
License
-
Repository
-
Last release
4 months ago

vue-free-table

基于 element ui table 二次封装,几乎支持原 table 所有的功能

文档使用

DEMO 预览

特性

  • 以 element-ui table 为基础进行二次封装,减少代码量
  • 继承 element-ui table 组件的参数及事件
  • 支持 render 渲染
  • 支持 slot 插槽
  • 支持组件引入
  • 支持树形数据
  • 支持分页功能

文档

属性说明类型默认
datatable 的 data 属性Array[]
column用于控制表格列渲染Array[]
columns-props用于定义所有 column 公共的属性Object
pagination是否显示分页组件, 具体详细请看pagination配置栏目Booleanfalse

只是在 Element Table 封装了一层,原本设置在 Table 上的 props 与事件监听和设置都可以直接绑定到组件上,具体配置可参考Element Tabel 文档

column 配置 column 用于控制表格的列行为, 设置示例:

const column = [
  { label: '日期', prop: 'date', width: 100 },
  { label: '姓名', prop: 'name' },
  { label: '邮编', prop: 'zip' },
  {
    label: '地址',
    prop: 'address',
    render: (h, scope) => {
      return (<el-tag>{scope.row.address}<el-tag>)
    }
  },
  {
    label: '组件',
    prop: 'cmp',
    component: EditBtn,
    listeners: {
      'row-edit'(row) {
        console.log('row-edit', row)
      }
    }
  }
]

columns-props 配置 columns-props 用于配置 columns 各列默认的 props 属性,

const columnsProps = {
  align: 'left',
  minWidth: 120
}

pagination 配置 pagination 用于控制显示分页组件, pagination 分页组件是继承 el-pagination 的二次封装,来源开源项目中的vue-element-admin 组件库中分页组件

参数说明类型默认值
total总条目数Number/
page当前页数 支持 .sync 修饰符Number1
limit每页显示条目个数,支持 .sync 修饰符Number20
page-sizes每页显示个数选择器的选项设置Number[]10, 20, 30, 50
hidden是否隐藏Booleanfalse
auto-scroll分页之后是否自动滚动到顶部Booleantrue

其它 Element 的 el-pagination 支持的属性,它也都支持。详情见文档

示例

<template>
  <bi-table border stripe :data="data" :column="column"></bi-table>
</template>

<script>
import BiTable from '@/components/BiTable'

export default {
  components: {
    BiTable
  },
  data() {
    return {
      column: [
        { label: '日期', prop: 'date' },
        { label: '姓名', prop: 'name' },
        { label: '省份', prop: 'province' },
        { label: '市区', prop: 'city' },
        { label: '地址', prop: 'address' }
      ],
      data: [
        {
          date: '2016-05-03',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄'
        },
        {
          date: '2016-05-02',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄'
        }
      ]
    }
  }
}
</script>

构建命令

# 安装依赖包
npm install

# 启动开发环境
npm run serve

# 构建生产环境
npm run build

# 启动unit测试
npm run test:unit

# 启动unit end-to-end 测试
npm run test:e2e

# 检查修复代码
npm run lint
1.4.4

4 months ago

1.4.3

4 months ago

1.4.2

4 months ago

1.4.1

5 months ago

1.3.2

6 months ago

1.3.1

6 months ago

1.2.1

8 months ago

1.1.99

8 months ago

1.1.98

8 months ago

1.1.92

8 months ago

1.1.91

8 months ago

1.1.96

8 months ago

1.1.95

8 months ago

1.1.94

8 months ago

1.1.93

8 months ago

1.1.97

8 months ago

1.1.1

10 months ago

1.1.0

10 months ago

1.1.9

10 months ago

1.1.8

10 months ago

1.1.7

10 months ago

1.1.6

10 months ago

1.1.5

10 months ago

1.1.4

10 months ago

1.1.3

10 months ago

1.1.2

10 months ago

1.0.11

11 months ago

1.0.10

11 months ago

1.0.9

12 months ago

1.0.8

1 year ago

1.0.7

1 year ago

1.0.6

1 year ago

1.0.5

1 year ago

1.0.4

1 year ago

1.0.2

1 year ago

1.0.1

1 year ago

1.0.3

1 year ago

1.0.0

1 year ago

0.3.4

1 year ago

0.3.3

1 year ago

0.3.2

1 year ago

0.3.1

1 year ago

0.3.0

1 year ago

0.2.3

1 year ago

0.2.2

1 year ago

0.2.1

2 years ago

0.1.85

2 years ago

0.1.81

2 years ago

0.1.82

2 years ago

0.1.83

2 years ago

0.1.84

2 years ago

0.1.80

2 years ago

0.1.74

2 years ago

0.1.75

2 years ago

0.1.76

2 years ago

0.1.77

2 years ago

0.1.78

2 years ago

0.1.79

2 years ago

0.1.70

2 years ago

0.1.71

2 years ago

0.1.72

2 years ago

0.1.73

2 years ago

0.1.69

2 years ago

0.1.68

2 years ago

0.1.63

2 years ago

0.1.64

2 years ago

0.1.65

2 years ago

0.1.66

2 years ago

0.1.67

2 years ago

0.1.62

2 years ago

0.1.59

3 years ago

0.1.60

3 years ago

0.1.61

2 years ago

0.1.52

3 years ago

0.1.53

3 years ago

0.1.54

3 years ago

0.1.55

3 years ago

0.1.56

3 years ago

0.1.57

3 years ago

0.1.58

3 years ago

0.1.50

3 years ago

0.1.51

3 years ago

0.1.49

3 years ago

0.1.43

3 years ago

0.1.44

3 years ago

0.1.45

3 years ago

0.1.46

3 years ago

0.1.47

3 years ago

0.1.48

3 years ago

0.1.30

3 years ago

0.1.31

3 years ago

0.1.32

3 years ago

0.1.33

3 years ago

0.1.34

3 years ago

0.1.35

3 years ago

0.1.36

3 years ago

0.1.37

3 years ago

0.1.27

3 years ago

0.1.28

3 years ago

0.1.29

3 years ago

0.1.41

3 years ago

0.1.42

3 years ago

0.1.21

3 years ago

0.1.22

3 years ago

0.1.23

3 years ago

0.1.24

3 years ago

0.1.25

3 years ago

0.1.26

3 years ago

0.1.40

3 years ago

0.1.38

3 years ago

0.1.39

3 years ago

0.1.20

3 years ago

0.1.11

4 years ago

0.1.12

4 years ago

0.1.13

4 years ago

0.1.14

4 years ago

0.1.15

4 years ago

0.1.16

3 years ago

0.1.17

3 years ago

0.1.18

3 years ago

0.1.19

3 years ago

0.1.10

4 years ago

0.1.9

4 years ago

0.1.8

4 years ago

0.1.7

4 years ago

0.1.6

4 years ago

0.1.5

4 years ago

0.1.2

4 years ago

0.1.4

4 years ago

0.1.3

4 years ago

0.1.1

4 years ago

0.1.0

4 years ago