🌜
🌞
vue-easytable

vue-easytable

v2.18.0-beta.8

Vue table component

npm install vue-easytable

README

npm vue2 NPM downloads codecov license Discord Gitter

vue-easytable

English | 中文

Become a Patreon

Sponsors

Support this project by becoming a sponsor. Your logo or name will show up here with a link you provided. Become a sponsor

Introduction

Based on vue2.x flexible table components.

API & Examples

Features

Base components

Table component

If there is no feature you want, Please Tell Us

Install

npm install vue-easytable

or

yarn add vue-easytable

Usage

Write the following in mian.js:

import Vue from "vue";
import "vue-easytable/libs/theme-default/index.css";
import VueEasytable from "vue-easytable";

Vue.use(VueEasytable);

new Vue({
  el: "#app",
  render: (h) => h(App),
});

Example:

<template>
  <ve-table :columns="columns" :table-data="tableData" />
</template>

<script>
  export default {
    data() {
      return {
        columns: [
          { field: "name", key: "a", title: "Name", align: "center" },
          { field: "date", key: "b", title: "Date", align: "left" },
          { field: "hobby", key: "c", title: "Hobby", align: "right" },
          { field: "address", key: "d", title: "Address" },
        ],
        tableData: [
          {
            name: "John",
            date: "1900-05-20",
            hobby: "coding and coding repeat",
            address: "No.1 Century Avenue, Shanghai",
          },
          {
            name: "Dickerson",
            date: "1910-06-20",
            hobby: "coding and coding repeat",
            address: "No.1 Century Avenue, Beijing",
          },
          {
            name: "Larsen",
            date: "2000-07-20",
            hobby: "coding and coding repeat",
            address: "No.1 Century Avenue, Chongqing",
          },
          {
            name: "Geneva",
            date: "2010-08-20",
            hobby: "coding and coding repeat",
            address: "No.1 Century Avenue, Xiamen",
          },
          {
            name: "Jami",
            date: "2020-09-20",
            hobby: "coding and coding repeat",
            address: "No.1 Century Avenue, Shenzhen",
          },
        ],
      };
    },
  };
</script>

Todo List

What are we doing

Environment Support

  • Modern browser and ie11 and above
IE / Edge
IE / Edge
Firefox
Firefox
Chrome
Chrome
Safari
Safari
Opera
Opera
IE11, Edge last 2 versions last 2 versions last 2 versions last 2 versions

How to contribute

If you want to contribute,just create a Pull Request

Contributors

Thanks to the following friends for their contributions 🙏

contributor

Discussion group

License

http://www.opensource.org/licenses/mit-license.php

Release Notes

2.17.3
By Huang ShuWei • Published on June 3, 2022

Bug Fixes

  • Fix the bug that page number jump is not updated #483
  • Fix the bug that the edit cell position display error when drag scroll bar #485

Bug Fixes

  • 修复分页组件跳转页码没有更新的问题 #483
  • 修复拖动滚动条导致编辑单元格显示位置不正确的问题 #485
2.17.2
By Huang ShuWei • Published on May 19, 2022

Bug Fixes

  • Fix the bug that the contextment panel can't' be displayed after the dynamic modification of the contextment option
  • Fix the bug that incorrect positioning of edit text box in some browsers (QQ, Safari, etc.) #471

  • 修复右键菜单配置动态修改后,右键菜单功无法显示的问题
  • 修复在部分浏览器(QQ、Safari 等)编辑文本框定位不准确的问题 #471
2.17.1
By Huang ShuWei • Published on May 16, 2022

Bug Fixes

  • Fixed the problem that the background color of dark theme virtual scrolling table row did not take effect

Bug Fixes

  • 修复暗黑主题虚拟滚动表格行背景色没生效的问题
2.17.0
By Huang ShuWei • Published on May 15, 2022

Feature

  • Add dark theme variables #479 @Aruelius

Bug Fixes

  • Fixed some problems under the dark theme

Feature

  • 添加暗黑主题变量 #479 @Aruelius

Bug Fixes

  • 修复暗黑主题下存在的一些问题
2.16.3
By Huang ShuWei • Published on April 26, 2022

Bug Fixes

  • Fix the bug that the right-click menu is combined with cell editing. After deleting a row, the header will disappear #477
  • Fix the bug that dynamically turn on or off virtual scrolling, table rendering error #478

Bug Fixes

  • 修复开启单元格编辑功能,当最后一行数据被删除,表头消失的问题 #477
  • 修复动态开启或关闭虚拟滚动,表格渲染异常的问题 #478
2.16.2
By Huang ShuWei • Published on April 12, 2022

Bug Fixes

  • Fix the bug that the filter custom layer could not be closed

Bug Fixes

  • 修复筛选自定义弹层无法关闭的问题
2.16.1
By Huang ShuWei • Published on April 8, 2022

Bug Fixes

  • Fix the bug that the virtual list cannot scroll to the last row by scrollToRowKey #470
  • Fix the bug that the first Chinese cannot match after entering Pinyin after clicking on the cell

Bug Fixes

  • 修复虚拟滚动列表无法通过实例方法scrollToRowKey滚动到底部的问题 #470
  • 修复单元格点击后,输入拼音后第一个中文无法匹配的问题
2.16.0
By Huang ShuWei • Published on March 25, 2022

Feature

  • Add new instance method scrollToColKey({colKey}) detail
  • Add new instance method setCellSelection({rowKey,colKey}) detail
  • Cell selection by click, and the hidden row will be automatically displayed in the visible range detail

Bug Fixes

  • Fix the bug that multiple tables have fixed columns, and only one is effective #467
  • Fix the bug that multiple right-click menu component options are suspended and only one takes effect

Feature

  • 新增列滚动实例方法 scrollToColKey({colKey}) 查看详情
  • 新增单元格选中实例方法 setCellSelection({rowKey,colKey}) 查看详情
  • 单元格点击选择,自动将隐藏的行内容显示在可视范围 查看详情

Bug Fixes

  • 修复多个表格包含固定列功能,只有一个生效的问题 #467
  • 修复多个右键菜单选项悬浮,只有一个生效的问题

General

License
MIT
Typescript Types
None found
Tree-shakeable
No

Popularity

GitHub Stargazers
2,975
Community Interest
3,039
Number of Forks
583

Maintenance

Commits
11/2110/220200
Last Commit
Open Issues
37
Closed Issues
422
Open Pull Requests
1
Closed Pull Requests
13

Versions

Versions Released
11/2110/2206
Latest Version Released
Aug 4, 2022
Current Tags
latest2.18.0-beta.8

Contributors

huangshuwei
huangshuwei
Commits: 426
ly525
ly525
Commits: 6
zhangjiayu1215
zhangjiayu1215
Commits: 3
ElectronSz
ElectronSz
Commits: 2
tterrasson
tterrasson
Commits: 2
wchbrad
wchbrad
Commits: 1
vt167098
vt167098
Commits: 1
hoyo
hoyo
Commits: 1