1.0.3 • Published 1 day ago

bi-element-ui v1.0.3

Weekly downloads
-
License
-
Repository
-
Last release
1 day 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.0.2

2 days ago

1.0.1

2 days ago

1.0.3

1 day ago

1.0.0

17 days ago

0.3.4

2 months ago

0.3.3

2 months ago

0.3.2

2 months ago

0.3.1

2 months ago

0.3.0

2 months ago

0.2.3

3 months ago

0.2.2

4 months ago

0.2.1

5 months ago

0.1.85

9 months ago

0.1.81

10 months ago

0.1.82

10 months ago

0.1.83

10 months ago

0.1.84

10 months ago

0.1.80

1 year ago

0.1.74

1 year ago

0.1.75

1 year ago

0.1.76

1 year ago

0.1.77

1 year ago

0.1.78

1 year ago

0.1.79

1 year ago

0.1.70

1 year ago

0.1.71

1 year ago

0.1.72

1 year ago

0.1.73

1 year ago

0.1.69

1 year ago

0.1.68

1 year ago

0.1.63

1 year ago

0.1.64

1 year ago

0.1.65

1 year ago

0.1.66

1 year ago

0.1.67

1 year ago

0.1.62

1 year ago

0.1.59

1 year ago

0.1.60

1 year ago

0.1.61

1 year ago

0.1.52

1 year ago

0.1.53

1 year ago

0.1.54

1 year ago

0.1.55

1 year ago

0.1.56

1 year ago

0.1.57

1 year ago

0.1.58

1 year ago

0.1.50

2 years ago

0.1.51

1 year ago

0.1.49

2 years ago

0.1.43

2 years ago

0.1.44

2 years ago

0.1.45

2 years ago

0.1.46

2 years ago

0.1.47

2 years ago

0.1.48

2 years ago

0.1.30

2 years ago

0.1.31

2 years ago

0.1.32

2 years ago

0.1.33

2 years ago

0.1.34

2 years ago

0.1.35

2 years ago

0.1.36

2 years ago

0.1.37

2 years ago

0.1.27

2 years ago

0.1.28

2 years ago

0.1.29

2 years ago

0.1.41

2 years ago

0.1.42

2 years ago

0.1.21

2 years ago

0.1.22

2 years ago

0.1.23

2 years ago

0.1.24

2 years ago

0.1.25

2 years ago

0.1.26

2 years ago

0.1.40

2 years ago

0.1.38

2 years ago

0.1.39

2 years ago

0.1.20

2 years ago

0.1.11

2 years ago

0.1.12

2 years ago

0.1.13

2 years ago

0.1.14

2 years ago

0.1.15

2 years ago

0.1.16

2 years ago

0.1.17

2 years ago

0.1.18

2 years ago

0.1.19

2 years ago

0.1.10

2 years ago

0.1.9

2 years ago

0.1.8

3 years ago

0.1.7

3 years ago

0.1.6

3 years ago

0.1.5

3 years ago

0.1.2

3 years ago

0.1.4

3 years ago

0.1.3

3 years ago

0.1.1

3 years ago

0.1.0

3 years ago