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:
or, import into your module npm install vue-dummy --save-dev
Vue
Dummy Text
Choose the number of words:
Choose random amount of words between 3 & 10:
<!-- Note: the quotes to pass the expression as a string --> <!-- or, as a Vue argument-->
As a component:
Dummy Images
<!-- Note: the quotes to pass the expression as a string --><!-- or, as a Vue argument --><!-- or, as a Vue modifier -->
Use width & height attribues or, size with CSS
Defaults to the size of the parent container
Create random sized images. Useful for testing dimentions of unknown sized user uploaded images
<!-- Note: the quotes to pass the expression as a string --> <!-- or, as a Vue argument (or modifier) -->
As a component:
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
<!-- outputs a small list --> <!-- outputs a small list --> <!-- outputs a small table -->
Example Repeat Elements
Combine with v-for
to repeat elements
#{{i}}: