Skip to content

2. Installation

el-jacko edited this page Jun 18, 2017 · 3 revisions

If you use Webpack/Browserify

npm

npm install --save vue-editortable

Import globally in an App:

import VueEditortable from "vue-editortable"
Vue.component('vue-editortable', VueEditortable)

Import locally in a component:

import VueEditortable from "vue-editortable"
// ...
components: {
    VueEditortable,
  }
// ...

Usage

Use the component in your html. Bind the necessary data like columns, options, and more. For more information have a look at the configuration page.

Important Note: The imported data must have an Id column.

Html

<vue-editortable :data="{ columns, options }"></vue-editortable>

Javascript

// ...
data() {
      return {
        columns: [
          {
            title: 'Id',
            name: 'id',
            editable: false,
          },
          {
            title: 'Firstname',
            name: 'firstname',
            editable: true,
          },
          {
            title: 'Lastname',
            name: 'lastname',
            editable: true,
          },
          {
            title: 'Email',
            name: 'email',
            editable: true,
          },
        ],
        options: {
          showSearchFilter: true,
          requests: {
            postUrl: 'http://api.dev/api/users/create',
          },
        },
      };
    },
// ...
Clone this wiki locally