Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ridaamirini/vue-cloneya
A Vue.js 2 component to clone DOM elements
https://github.com/ridaamirini/vue-cloneya
clone component forms input jquery-clone vue
Last synced: 2 months ago
JSON representation
A Vue.js 2 component to clone DOM elements
- Host: GitHub
- URL: https://github.com/ridaamirini/vue-cloneya
- Owner: ridaamirini
- License: mit
- Created: 2018-05-16T09:02:11.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2022-12-03T19:23:36.000Z (over 1 year ago)
- Last Synced: 2024-03-24T21:23:15.391Z (3 months ago)
- Topics: clone, component, forms, input, jquery-clone, vue
- Language: JavaScript
- Homepage:
- Size: 540 KB
- Stars: 16
- Watchers: 4
- Forks: 3
- Open Issues: 12
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Lists
- awesome-vue - vue-cloneya - A vue component to clone DOM elements (Components & Libraries / UI Components)
- awesome-vue - vue-cloneya - A vue component to clone DOM elements (Components & Libraries / UI Components)
- awesome-vue - vue-cloneya - A vue component to clone DOM elements (Components & Libraries / UI Components)
- awesome-vue - vue-cloneya - A vue component to clone DOM elements (Components & Libraries / UI Components)
- awesome-vue - vue-cloneya - A vue component to clone DOM elements (Components & Libraries / UI Components)
- awesome-vue - vue-cloneya - A vue component to clone DOM elements (Components & Libraries / UI Components)
- awesome-vue - vue-cloneya - A vue component to clone DOM elements (Components & Libraries / UI Components)
- awesome-vue - vue-cloneya - A vue component to clone DOM elements (Components & Libraries / UI Components)
- awesome-vue - vue-cloneya - A vue component to clone DOM elements (Components & Libraries / UI Components)
- awesome-vue - vue-cloneya - A Vue.js 2 component to clone DOM elements ` 📝 2 years ago` (UI Components [🔝](#readme))
- awesome-vue - vue-cloneya - A vue component to clone DOM elements (UI Components / Miscellaneous)
- awesome-vue - vue-cloneya ★7 - A vue component to clone DOM elements (UI Components / Miscellaneous)
- awesome-vue - vue-cloneya - A vue component to clone DOM elements (UI Components / Miscellaneous)
- awesome-vue - vue-cloneya - A vue component to clone DOM elements (Components & Libraries / UI Components)
README
# vue-cloneya
[![npm](https://img.shields.io/npm/v/vue-cloneya.svg?style=for-the-badge)](https://www.npmjs.com/package/vue-cloneya)
[![npm](https://img.shields.io/npm/dt/vue-cloneya.svg?style=for-the-badge)](https://www.npmjs.com/package/vue-cloneya)
[![npm](https://img.shields.io/npm/l/vue-cloneya.svg?style=for-the-badge)](https://www.npmjs.com/package/vue-cloneya)> A vue component to clone DOM elements
[Live demo here](https://codesandbox.io/s/rmoq935pjp)
## Install
```bash
yarn add vue-cloneya
# or
npm i vue-cloneya
```## Import
```js
import Vue from 'vue'
import VueCloneya from 'vue-cloneya'Vue.use(VueCloneya)
```
## Example
```vue
```
#### Output:
```Javascript
[
"Some value",
// ...
]
```#### With multiple elements:
```vue
```
#### Output:
```Javascript
[
{
Firstname: "VALUE",
Lastname: "VALUE"
}
// ...
]
```## API
### Props
#### minimum
- __Type__: `number`
- __Default__: `1`The minimum number of clones allowed.
#### maximum
- __Type__: `number`
- __Default__: `1`The maximum number of clones allowed.
#### value
- __Type__: `array`
- __Default__: `null`The values for the v-cloneya-input. For Two-way Data Binding use `v-model`
#### multiple
- __Type__: `boolean`
- __Default__: `false`Enables multiple `v-model` on multiple `v-cloneya-input` elements. `Sinice 1.0.6`
### Events
When minimum limit is reached:
- `minimum:cloneya`When maximum limit is reached:
- `maximum:cloneya`## Directives
#### cloneyaInput
v-cloneya-input- __Type__: `string` _optional_
If `:multiple="true"` is enabled, you must supply the key where you wanted to retrieve the data on `v-model`
#### cloneyaAdd
v-cloneya-add#### cloneyaRemove
v-cloneya-remove## Development
```bash
# for dev
yarn dev
#or
npm run dev# build with parcel-bundler
yarn build
#or
npm run build```
## License
MIT © [ridaamirini](https://github.com/ridaamirini)