加入CODE CHINA

· 不限速    · 不限空间    · 不限人数    · 私仓免费

免费加入
README.md

npm vue2 NPM downloads codecov Build Status license chat

vue-easytable

English | 中文

Introduction

Based on vue2.x flexible table components.

v2.0 New Version npm

  • Complete rewriting of version 1.0. Based on JSX syntax rewriting、Parameter naming normalization、Event naming normalization, etc
  • Support International
  • Support Custom theme & Built in two themes
  • Support Virtual scrolling
  • Support Row expand
  • Support Custom cell content. Based on render function
  • Support Custom event
  • Support Cell ellipsis
  • Support Loading component
  • Add Unit test > 85% coverage
  • Official document update
  • For more information, Refer to official document

Features

  • Easy to use
  • Powerful
  • Unit test coverage greater than 85%

API & Examples

Official documents

Supports

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 ie10 and above
IE / EdgeIE / Edge FirefoxFirefox ChromeChrome SafariSafari OperaOpera
IE10, 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

Discussion group

Join in Discord Chat Room

License

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

项目简介

🚀 Github 镜像仓库 🚀

源项目地址

https://github.com/huangshuwei/vue-easytable

发行版本 50

v2.4.2

全部发行版

贡献者 7

开发语言

  • JavaScript 88.1 %
  • Less 6.7 %
  • HTML 3.0 %
  • CSS 2.2 %