# vxe-table

**Repository Path**: daoims/vxe-table

## Basic Information

- **Project Name**: vxe-table
- **Description**: vxe-table vue 表格解决方案
- **Primary Language**: JavaScript
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 988
- **Created**: 2020-05-12
- **Last Updated**: 2021-04-22

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# vxe-table-dao
扩展 [vxe-table](https://gitee.com/xuliangzhan_admin/vxe-table) 功能


## 扩展功能
### 编辑模式添加配置 enterAsTab: boolean，默认是false
当enterAsTab为true,用户按回车键时相当于按Tab键的功能

:keyboard-config="{isArrow: true, isDel: true, isEnter: true, isTab: true, isEdit: true, enterAsTab: true, editMethod}"

### column 属性添加 editable: boolean，默认是 true
只有 editable为true,选取的cell才启动编辑
<vxe-table-column field="name" title="Name" :editable="true" :edit-render="{name: 'input', autoselect: true}"></vxe-table-column>

## Docs

[To view the user guide 使用指南](https://github.com/xuliangzhan/vxe-table-demo)

[To view the example](https://xuliangzhan.github.io/vxe-table/#/table/base/basic) [查看演示](https://xuliangzhan_admin.gitee.io/vxe-table/#/table/base/basic)  
[To view the document](https://xuliangzhan.github.io/vxe-table/#/table/api) [查看文档](https://xuliangzhan_admin.gitee.io/vxe-table/#/table/api)  

## Installing

依赖库：[vue](https://www.npmjs.com/package/vue) 2.6+, [xe-utils](https://www.npmjs.com/package/xe-utils) 2.4+

```shell
npm install xe-utils vxe-table-dao
```

Get on [unpkg](https://unpkg.com/vxe-table/) and [cdnjs](https://cdn.jsdelivr.net/npm/vxe-table/)

### npm

```javascript
import Vue from 'vue'
import 'xe-utils'
import VXETable from 'vxe-table-dao'
import 'vxe-table-dao/lib/index.css'

Vue.use(VXETable)
```

## Example

```html
<template>
  <div>
    <vxe-table :data="tableData">
      <vxe-table-column type="seq" title="Seq" width="80"></vxe-table-column>
      <vxe-table-column field="name" title="Name"></vxe-table-column>
      <vxe-table-column field="sex" title="Sex"></vxe-table-column>
      <vxe-table-column field="address" title="Address"></vxe-table-column>
    </vxe-table>
  </div>
</template>

<script>
export default {
  data () {
    return {
      tableData: [
        { id: 10001, name: 'Test1', role: 'Develop', sex: 'Man', address: 'Shenzhen' },
        { id: 10002, name: 'Test2', role: 'Test', sex: 'Man', address: 'Guangzhou' },
        { id: 10003, name: 'Test3', role: 'PM', sex: 'Man', address: 'Shanghai' }
      ]
    }
  }
}
</script>
```

## License

MIT License, 2019-present, dao