Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

vue-easytable

Package Overview
Dependencies
Maintainers
1
Versions
139
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

vue-easytable

Vue table component

  • 2.27.1
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
4.4K
decreased by-14.18%
Maintainers
1
Weekly downloads
 
Created
Source

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

Gold Sponsor

Silver Sponsor

Become a Patreon

Generous Sponsor

Introduction

A powerful data table based on vue2.x You can use it as data grid、Microsoft Excel or Google sheets. It supports virtual scroll、cell edit etc.

Characteristics

  • Support 300000 rows of data display through virtual scroll
  • Free forever. Of course, you can also choose to donate

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 main.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, Edgelast 2 versionslast 2 versionslast 2 versionslast 2 versions

How to contribute

If you want to contribute,just create a Pull Request

Contributors

Thanks to the following friends for their contributions 🙏

Discussion group

License

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

Keywords

FAQs

Package last updated on 21 May 2023

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc