# vuc-input

> A vue-canvas effects components

Latest version **1.1.0** (published 2019-08-01) · MIT license · 0 weekly downloads

## Install

```sh
npm install vuc-input
pnpm add vuc-input
yarn add vuc-input
bun add vuc-input
```

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.0 |
| Published | 2019-08-01 |
| First published | 2018-11-25 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 117.9 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| Author | ChenYong Tian |
| Maintainers | loo4p |
| Keywords | vue, canvas, input, effects |

## Links

- npm: https://www.npmjs.com/package/vuc-input
- Homepage: https://github.com/loo41/vuc
- Issues: https://github.com/loo41/vuc/issues
- npm.io page: https://npm.io/package/vuc-input

## Dependencies (2)

- [vue](https://npm.io/package/vue.md) ^2.5.11
- [url-loader](https://npm.io/package/url-loader.md) ^1.1.2

## Alternatives

- [exif-parser](https://npm.io/package/exif-parser.md) — 3.8M weekly downloads
- [vite-plugin-compression](https://npm.io/package/vite-plugin-compression.md) — 569.5K weekly downloads
- [pica](https://npm.io/package/pica.md) — 442.4K weekly downloads
- [@reportportal/client-javascript](https://npm.io/package/@reportportal/client-javascript.md) — 408.8K weekly downloads
- [@tldraw/state](https://npm.io/package/@tldraw/state.md) — 316.0K weekly downloads

## Recent versions

- 1.1.0 (latest) — 2019-08-01
- 1.0.3 — 2018-11-27
- 1.0.2 — 2018-11-26
- 1.0.1 — 2018-11-25
- 1.0.0 — 2018-11-25

## README

## vuc-input

---

[中文文档](https://github.com/loo41/vuc/blob/master/package/vuc-input/doc/Chinese.md)

---


### Install

```
    npm install --save vuc-input
    
    yarn add vuc-input
```

---

### Basic use 

```
    // Global
    
    import vucInput from 'vuc-input'
    Vue.use(vucInput)
    
    // Local
    
    import {vucInput} from 'vuc-input'
    export default {
      components: {vucInput}
    }
    
```

---

### Global Attribute Method

| Attribute |      Type      |   Default value  |   Explain     |
|----------| ------------- | ---------- | ---------- |
| className| string        |            | Class Style of Input Box   |
| input-style| string      |            | Input Box Style Width and Height Doesn't Work   |
| disabled | boolean        | false      | Availability |
| autofocus | boolean      | false      | Autofocus or not |
| full-width | boolean     | false      | Full of Father's Box |
| H        | number        | 55         | height (Include padding)|
| W        | number        | 300        | width (Include padding)|
|padding   | number        | 10         | padding value |
| num       |   number      | 10         | Number of animated particles |
| size     | number        | 10         | Particle size |
| type     | string        | rect       | Particle type (arc square rect icon) Icon implements custom effects |
|styleType | string        | fill       | Is the Particle Stroke or Fill Style  (stroke  || fill) |
| drawImg  | Array         | []         | Pictures drawn in icon mode (The suggestion is icon's PNG picture)|
| color    | Array         | ['black']  | Drawing Particle Effect Colors |
| help-text| string        |            | Prompt text    |
| focus    | function      |            |  |
| blur     | function      |            |  |
| change   | function      |            |  |
| alpha    | Number | Boolean      | true      | Whether the transparency of particles is random, true is random, false or number is not random, number will control transparency, false will be 1 |

### Tip

- In order to be compatible with some special effects, some effects of input input box are removed. 
- In the case of focus acquisition, the focus position cannot be switched with the mouse, because the canvas level is higher than the input level in the case of focus acquisition. 
- There are differences between IE and WebKit kernel

### Welcome pr issues star

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