Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/paulcollett/vue-dummy

Placeholder Images and Lorem Ipsum Dummy Text for Vue.js projects
https://github.com/paulcollett/vue-dummy

Last synced: 26 days ago
JSON representation

Placeholder Images and Lorem Ipsum Dummy Text for Vue.js projects

Lists

README 

        
### vue-dummy

## Placeholder Images and Dummy Text for Vue.js



`vue-dummy` is a wrapper around the https://dummyjs.com/ library to expose placeholder Images and Dummy, Lorum Ipsum Text as a vue directive



## Usage



Add to your HTML page:



```html



```



or, import into your module `npm install vue-dummy --save-dev`



```js

import Vue from "vue"

import VueDummy from "vue-dummy"



Vue.use(VueDummy)

```



## Dummy Text



```html



```



Choose the number of words:

```html



```



Choose random amount of words between 3 & 10:

```html

 

 

```



As a component:

```html



```



## Dummy Images



```html



```



```html

 





```



Use width & height attribues _or, size with CSS_

```html



```



Defaults to the size of the parent container

```html



```



Create random sized images. _Useful for testing dimentions of unknown sized user uploaded images_

```html

 

 

```



As a component:

```html



```



## Special Elements



Using `v-dummy` on some tags will result in some placeholder content with expected markup. This is useful in some cases like quick styling of elements

```html

     

       

       

      ```
      


      ## Example Repeat Elements
      


      Combine with `v-for` to repeat elements
      


      ```html

        
        

            
      • #{{i}}: 
        • 

          
      

      ```
      


      #### Examples

      https://git.io/vue-dummy-example