当前仓库属于暂停状态,部分功能使用受限,详情请查阅 仓库状态说明
1 Star 0 Fork 861

hsp / vxe-table
暂停

forked from xuliangzhan / vxe-table 
加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
克隆/下载
贡献代码
同步代码
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README
MIT

vxe-table

简体中文 | English

gitee star npm version npm build npm downloads gzip size: JS gzip size: CSS
issues issues closed pull requests pull requests closed npm license

一个基于 vue 的 PC 端表格组件,支持增删改查、虚拟滚动、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、虚拟列表、模态窗口、自定义模板、渲染器、贼灵活的配置项、扩展接口等...

  • 设计理念

    • 面向现代浏览器,高效的简洁 API 设计
    • 模块化表格、按需加载、扩展接口
    • 为单行编辑表格而设计,支持增删改查及更多扩展,强大的功能的同时兼具性能
  • 计划

    • v1.0 100% 基于 vue2.6+,支持所有主流的浏览器,实现表格的一切实用的功能
    • v2.0  100% 基于 vue2.6+,支持所有主流的浏览器,同时兼具功能与性能
    • v3.0   60% 基于 vue2.6+,只支持 H5 浏览器,不支持 IE,渲染性能大幅提升
    • v4.0   0% 基于 vue3+,只支持 H5 浏览器,不支持 IE,渲染性能大幅提升

👉 如果有更好的建议、优化点或 Bug 都欢迎提 Issues

浏览器支持

Edge Chrome Firefox Opera Safari
Latest ✔ Latest ✔ Latest ✔ Latest ✔ Latest ✔

功能点

  • 基础表格
  • 高级表格
  • 斑马线条纹
  • 多种边框
  • 单元格样式
  • 列宽拖动
  • 最大高度
  • 自适应宽高
  • 固定列
  • 多级表头
  • 表尾数据
  • 高亮行、列
  • 序号
  • 单选框
  • 复选框
  • 下拉选项
  • 开关
  • 排序
  • 筛选
  • 合并行或列
  • 导入
  • 导出
  • 打印
  • 显示/隐藏列
  • 加载中
  • 格式化内容
  • 自定义插槽/模板
  • 快捷菜单
  • 展开行
  • 分页
  • 表单
  • 工具栏
  • 下拉容器
  • 虚拟列表
  • 增删改查
  • 树表格
  • 数据校验
  • 数据代理
  • 键盘导航
  • 模态窗口
  • 渲染器
  • 虚拟滚动

模块&组件

安装

依赖库:vue 2.6+, xe-utils 2.4+

npm install xe-utils vxe-table

Get on unpkg and cdnjs

npm

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

Vue.use(VXETable)

CDN

<!-- 引入样式 -->
<link rel="stylesheet" href="https://unpkg.com/vxe-table/lib/index.css">
<!-- 引入脚本 -->
<script src="https://unpkg.com/xe-utils"></script>
<script src="https://unpkg.com/vxe-table"></script>
<!-- 建议使用 CDN 方式引入的用户在链接地址上锁定版本,避免受到非兼容性更新的影响 -->

示例

<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>

文档说明

💡 使用指南
👉 查看演示
👉 查看文档

Donation

如果这个开源项目对您有帮助,请作者喝杯咖啡吧。☕
有问题欢迎留言或者提 Issues

由于维护一个开源项目需要花费非常大的精力与时间,如果您正在使用该项目,您的捐赠会帮助该项目能持续发展下去
👉 捐赠方式💰

License

MIT License, 2019-present, Xu Liangzhan

MIT License Copyright (c) 2019 Xu Liangzhan Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

简介

vxe-table vue 表格解决方案 展开 收起
JavaScript
MIT
取消

发行版

暂无发行版

贡献者

全部

近期动态

加载更多
不能加载更多了
JavaScript
1
https://gitee.com/gspandy78/vxe-table.git
git@gitee.com:gspandy78/vxe-table.git
gspandy78
vxe-table
vxe-table
master

搜索帮助

14c37bed 8189591 565d56ea 8189591