1.0.4-83 • Published 2 years ago

@dinert/element-ui v1.0.4-83

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

基于Vue二次封装的element-ui组件

技术栈

目录

│  .babelrc
│  .gitignore
│  index.html
│  package-lock.json
│  package.json
│  README.md
│  rollup.config.build.js
│  rollup.config.dev.js
│  yarn-error.log
│  yarn.lock
│
├─packages
│  ├─d-form
│  │  │  index.js
│  │  │
│  │  └─src
│  │          index.vue
│  │
│  ├─d-overflow-tooltip
│  │  │  index.js
│  │  │
│  │  └─src
│  │          index.vue
│  │
│  ├─d-table
│  │  │  index.js
│  │  │
│  │  └─src
│  │          index.vue
│  │          recuve-table-column.vue
│  │
│  └─d-table-page
│      │  index.js
│      │
│      └─src
│              index.vue
│
└─src
    │  index.js
    │
    └─utils
            getValue.js
            tools.js

安装

  • 使用npm
npm i @dinert/element-ui --save
  • 使用yarn
yarn add @dinert/element-ui

简述

  • 基于Vue二次封装的element-ui组件库,打包成esm、umd、cjs可供浏览器外链、vue的import、node的required的使用形式
  • 在封装时保留原有UI框架的属性和方法,可以较好的扩展自定义属性

使用

d-form组件

form-item 属性 — Object

  • form-item属性,如下代码第一层为对象,type和name代表的是element-ui框架中form-item属性的prop。第二层也是对象,对象中type代表的是组件类型,对象中其它属性为element-ui框架中的form-item的属性,第三层为options对象,这个对象下的属性代表的是每个组件中的属性。
  • 第二层对象中的属性是form-item,那么方法就在第二层属性加上一个on对象,on对象指的就是当前组件属性的方法
  • 那么第三层对象中组件的方法该怎么去绑定呢,比如下面的type为el-select的组件,options代表el-select组件中所有的属性,options.on就是绑定了el-selecte组件的所有方法,当el-select变化时会触发change事件。
formItem: {
  type: {
    type: 'select',
    label: '窗口类型',
    options: {
      on: {
        change() {

        },
      },
      options: [
        { value: '一口受理', label: '一口受理'
        },
        { value: '综合窗口', label: '综合窗口'
        },
        { value: '企业帮办', label: '企业帮办'
        },
        { value: '专窗', label: '专窗'
        },
        { value: '咨询台', label: '咨询台'
        },
      ],
    }
  },
  name: {
    type: 'input',
    label: '姓名',
    options: {}
  }
}

form 属性 — Object

  • form属性指的是element-ui中form的属性
  • form的方法指的是form.on对象中的方法

row 属性 — Object

  • row属性指的是element-ui中row的属性

colLayout 属性 — Object

  • colLayout属性指的是element-ui中row的属性

isSearch 属性 — Boolean

  • 判断是否显示右边搜索栏,默认为true

d-table组件

showHeader 属性 — Boolean

  • 是否显示表格上方的过滤选项,默认为true

showFooter 属性 — Boolean

  • 是否显示表格下方的分页,默认为true

table 属性 — Object

table: {
  tableColumn: [
    {
      type: 'selection',
      width: 55,
      align: 'center',
      label: '选择'
    },
    {
      prop: 'type',
      label: '窗口类型',
      children: [
        {
          prop: 'type1',
          label: '类型A',
          children: [
            {
              prop: 'type-a',
              label: '类型AB'
            },
            {
              prop: 'type4',
              label: '类型AC'
            },
          ]
        },
        {
          prop: 'type2',
          label: '类型B'
        }
      ]
    },
    {
      prop: 'name',
      label: '姓名',
    },
    {
      prop: 'code',
      label: '工号'
    },
    {
      prop: 'department',
      label: '部门'
    },
    {
      prop: 'enable',
      label: '大屏显示'
    },
    {
      prop: 'operations',
      label: '操作'
    }
  ],
  data: [
    {
    'name': 'pppppppppp',
    'type-a': 'a3123123'
    },
    {
    'name': 'pppppppppp',
    'type-a': 'a3123123'
    }
  ]
}

disabled 属性 — Boolean

  • 是否禁用所有的操作,默认为false

pagination 属性 — Object

tableSlot 属性 — Boolean

  • tableSlot是表格插槽属性,默认为false
  • 如果为true则不能用#column_type的名称去渲染表格中的数据,这样插槽的名称为#default。
  • tableSlot为true时适用于二次封装表格

d-table-page组件

d-table-page其实是d-form和d-table的结合体,抽取常用属性在这个组件中,属性配置请参考d-form和d-table,属性如下

form-item 属性 — Object

form 属性 — Object

table 属性 — Object

tableSlot 属性 — Boolean

pagination 属性 — Object

colLayout 属性 — Object

disabled 属性 — Boolean

showHeader 属性 — Boolean

showSearch 属性 — Boolean

d-dialog组件

dialog 属性 — Object

  • dialog下的属性为el-dialog中所有的属性
  • dialog.on对象为el-dialog的方法和事件
1.0.4-82

2 years ago

1.0.4-83

2 years ago

1.0.4-80

2 years ago

1.0.4-81

2 years ago

1.0.4-79

2 years ago

1.0.4-78

2 years ago

1.0.4-77

2 years ago

1.0.4-75

2 years ago

1.0.4-76

2 years ago

1.0.4-73

2 years ago

1.0.4-74

2 years ago

1.0.4-71

2 years ago

1.0.4-72

2 years ago

1.0.4-70

2 years ago

1.0.4-68

2 years ago

1.0.4-69

2 years ago

1.0.4-66

2 years ago

1.0.4-67

2 years ago

1.0.4-64

2 years ago

1.0.4-65

2 years ago

1.0.4-62

2 years ago

1.0.4-63

2 years ago

1.0.4-60

3 years ago

1.0.4-61

3 years ago

1.0.4-59

3 years ago

1.0.4-57

3 years ago

1.0.4-58

3 years ago

1.0.4-55

3 years ago

1.0.4-56

3 years ago

1.0.4-54

3 years ago

1.0.4-39

3 years ago

1.0.4-38

3 years ago

1.0.4-53

3 years ago

1.0.4-51

3 years ago

1.0.4-52

3 years ago

1.0.4-50

3 years ago

1.0.4-48

3 years ago

1.0.4-49

3 years ago

1.0.4-46

3 years ago

1.0.4-47

3 years ago

1.0.4-44

3 years ago

1.0.4-45

3 years ago

1.0.4-42

3 years ago

1.0.4-43

3 years ago

1.0.4-40

3 years ago

1.0.4-41

3 years ago

1.0.4-37

3 years ago

1.0.4-35

3 years ago

1.0.4-36

3 years ago

1.0.4-29

3 years ago

1.0.4-28

3 years ago

1.0.4-27

3 years ago

1.0.4-26

3 years ago

1.0.4-25

3 years ago

1.0.4-23

3 years ago

1.0.4-22

3 years ago

1.0.4-21

3 years ago

1.0.4-2.bate.13

3 years ago

1.0.4-2.bate.12

3 years ago

1.0.4-2.bate.11

3 years ago

1.0.4-2.bate.1

3 years ago

1.0.4-1.bate.99

3 years ago

1.0.4-1.bate.98

3 years ago

1.0.4-1.bate.97

3 years ago

1.0.4-1.bate.96

3 years ago

1.0.4-1.bate.95

3 years ago

1.0.4-1.bate.94

3 years ago

1.0.4-1.bate.93

3 years ago

1.0.4-1.bate.92

3 years ago

1.0.4-1.bate.91

3 years ago

1.0.4-1.bate.9

3 years ago

1.0.4-1.bate.89

3 years ago

1.0.4-1.bate.88

3 years ago

1.0.4-1.bate.87

3 years ago

1.0.4-1.bate.86

3 years ago

1.0.4-1.bate.85

3 years ago

1.0.4-1.bate.84

3 years ago

1.0.4-1.bate.83

3 years ago

1.0.4-1.bate.82

3 years ago

1.0.4-1.bate.81

3 years ago

1.0.4-1.bate.8

3 years ago

1.0.4-1.bate.7

3 years ago

1.0.4-1.bate.6

3 years ago

1.0.4-1.bate.5

3 years ago

1.0.4-1.bate.4

3 years ago

1.0.4-1.bate.3

3 years ago

1.0.4-1.bate.2

3 years ago

1.0.4-1.bate.1

3 years ago

1.0.41

3 years ago

1.0.4

3 years ago

1.0.39

3 years ago

1.0.38

3 years ago

1.0.37

3 years ago

1.0.36

3 years ago

1.0.35

3 years ago

1.0.34

3 years ago

1.0.33

3 years ago

1.0.3

3 years ago

1.0.29

3 years ago

1.0.28

3 years ago

1.0.27

3 years ago

1.0.26

3 years ago

1.0.25

3 years ago

1.0.24

3 years ago

1.0.23

3 years ago

1.0.22

3 years ago

1.0.21

3 years ago

1.0.2

3 years ago

1.0.19

3 years ago

1.0.18

3 years ago

1.0.17

3 years ago

1.0.16

3 years ago

1.0.15

3 years ago

1.0.14

3 years ago

1.0.13

3 years ago

1.0.12

3 years ago

1.0.11

3 years ago

1.0.9

3 years ago

1.0.8

3 years ago

1.0.7

3 years ago

1.0.6

3 years ago

1.0.5

3 years ago

0.0.5

3 years ago

0.0.4

3 years ago

0.0.3

3 years ago

0.0.2

3 years ago

0.0.1

3 years ago