# vue-clipboards

> Vue2.0 directive to copy or cut text to clipboard.

Latest version **1.3.0** (published 2019-06-06) · MIT license · 0 weekly downloads

## Install

```sh
npm install vue-clipboards
pnpm add vue-clipboards
yarn add vue-clipboards
bun add vue-clipboards
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.3.0 |
| Published | 2019-06-06 |
| First published | 2016-11-22 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 62 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 204 |
| Author | 卓文理 |
| Maintainers | zhuowenli |

## Links

- npm: https://www.npmjs.com/package/vue-clipboards
- Repository: https://github.com/zhuowenli/vue-clipboards
- Homepage: https://github.com/zhuowenli/vue-clipboards#readme
- Issues: https://github.com/zhuowenli/vue-clipboards/issues
- npm.io page: https://npm.io/package/vue-clipboards

## Dependencies (1)

- [clipboard](https://npm.io/package/clipboard.md) ^1.7.1

## Recent versions

- 1.3.0 (latest) — 2019-06-06
- 1.2.4 — 2018-03-19
- 1.2.3 — 2018-03-19
- 1.2.2 — 2018-03-03
- 1.2.1 — 2017-12-28
- 1.2.0 — 2017-11-13
- 1.1.0 — 2017-08-01
- 1.0.5 — 2017-07-27
- 1.0.4 — 2017-07-18
- 1.0.3 — 2017-07-17
- 1.0.2 — 2017-06-09
- 1.0.1 — 2017-06-09
- 1.0.0 — 2017-05-13
- 0.2.6 — 2017-03-07
- 0.2.5 — 2017-01-09
- … 7 more at https://npm.io/package/vue-clipboards/versions

## README

# vue-clipboard

📋 Vue2.0 directive to copy or cut text to clipboard.

Vue wrapper for [clipboard.js](https://github.com/zenorocha/clipboard.js).

DEMO: [https://zhuowenli.github.io/vue-clipboards/](https://zhuowenli.github.io/vue-clipboards/)

## Install

```
$ npm install vue-clipboards
```

## Usage

```js
import VueClipboards from 'vue-clipboards';

Vue.use(VueClipboards);

new Vue({
    data() {
        return {
            copyData: 'copy data'
        }
    }
});
```

```html
<button v-clipboard="copyData">Copy</button>
```

## Event

```html
<button v-clipboard="copyData" @success="handleSuccess" @error="handleError">Copy</button>
```

```js
import VueClipboards from 'vue-clipboards';

Vue.use(VueClipboards);

new Vue({
    data() {
        return {
            copyData: 'copy data'
        }
    },
    methods: {
        handleSuccess(e) {
            console.log(e);
        },
        handleError(e) {
            console.log(e);
        },
    }
});
```

## Development

- `yarn dev`: Run example in development mode
- `yarn deploy`: Deploy example to gh-pages
- `yarn build`: Build component in umd & es format
- `yarn watch`: Build component in umd & es format with watch mode

Check out your npm scripts, it's using [vbuild](https://github.com/egoist/vbuild) under the hood.

---

Generated by [create-vue-app](https://github.com/egoist/create-vue-app)

---
_Source: https://npm.io/package/vue-clipboards · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._