vuejs-editinline-plugin v1.0.15

How it work ?

To build and publish on NPM

Just add your component .vue in components folder

Then, import your component in wrapper.js and set it globally with Vue.component('nameOfYourComponent', yourComponent)

Then => in webpack.config.js and package.json => change the entry point with './src/wrapper.js', And finally uncomment the output part for build plugin and comment the output part for test component

Then => change the version in package.json

Delete the file in the /dist folder

npm run build npm publish

To test components

npm run dev

Text Input

To use text inline editing

<text-edit-inline v-model="msg" @updated="updated"/>

msg : your text data

@updated : callback (when save button is clicked) contains an object with old data and new data

Select Input

To use select inline editing

<select-edit-inline v-model="selected" @updated="updated" :options="options"/>

selected : id option selected by default

options :

options: [
    {
        id: 1,
        label: 'Value 1',
    },
    {
        id: 2,
        label: 'Value 2',
    },
    {
        id: 3,
        label: 'Value 3',
    },
]

@updated : callback (when save button is clicked) contains an object with old data (id) and new data (id)