Here you can know how to implement datepicker component using Vue.js datepicker component for Vue.js, already support Vue.js 2.x, the Vue.js 1.x version is on branch vue-1.x Follow these steps to make Datepicker componebt using vue.js Installation npm install vue-date –save Usage use with single .vue file: <template> <div> <datepicker v-model=”date”></datepicker> </div> </template> <script> import datepicker from ‘vue-date’ … Read more
Here is the following steps through that you can use Simple Confirm Dialog verification plugin with Vue.js Install $ npm install –save vue-confirm-dialog Quick Start Usage In main.js or plugin (for Nuxt.js): import Vue from ‘vue’ import VueConfirmDialog from ‘vue-confirm-dialog’ Vue.use(VueConfirmDialog) Vue.component(‘vue-confirm-dialog’, VueConfirmDialog.default) In App.vue (or in the template file for Nuxt.js (layout/default.vue)): <template> <div … Read more
Here is the following steps to use a simple list picker component made with Vue.js How to install npm $ npm install vue-list-picker –save yarn $ yarn add vue-list-picker Quick start Vue.js You can import in your main.js file import Vue from “vue”; import VueListPicker from “vue-list-picker”; Vue.use(VueListPicker); Or locally in any component import { … Read more
Vue-Hotspot is an image hotspot component for Vue.js Follow these steps to use it in your project npm (Recommended) $ npm install vue-hotspot –save yarn Usage ES Modules with npm (Recommended) import Vue from ‘vue’ import VueHotspot from ‘vue-hotspot’ Using the component <template> <v-hotspot :init-options=”hotspotConfig” @save-data=”saveData” @after-delete=”afterDelete” /> </template> <script> import Vue from ‘vue’ import VueHotspot … Read more
Toast notifications are a user-friendly way to provide feedback or alert users to important events in a web application. In this comprehensive guide, we’ll explore the process of creating a simple and flexible implementation of toast-style notifications using Vue.js. Leveraging the reactivity and component-based structure of Vue.js, you’ll be able to seamlessly integrate toast notifications … Read more
Circular progress bars are visually appealing elements that convey information about the completion status of a task. In this detailed guide, we’ll explore the process of creating a circular progress bar using Vue.js. Leveraging the power of Vue.js and SVG (Scalable Vector Graphics), we’ll build a customizable and elegant component that you can seamlessly integrate … Read more
Scroll loaders are essential components in web development, enabling dynamic loading of content as users scroll down a page. In this comprehensive guide, we’ll delve into creating a Vue.js scroll loader, exploring various techniques to seamlessly load and display data as the user scrolls through a page. Harnessing the power of Vue.js and its reactivity, … Read more
Progress bars are a fundamental element in user interfaces, providing visual feedback on the completion status of tasks. In this comprehensive guide, we’ll delve into creating a Vue.js progress bar, exploring various techniques to enhance its functionality and appearance. Whether you’re tracking file uploads, form submissions, or any other asynchronous operation, mastering progress bars in … Read more
Responsive design is a cornerstone of modern web development, ensuring that your application adapts gracefully to various screen sizes. In this comprehensive guide, we’ll explore how to achieve easy and reactive access to the width and height of your screen using Vue.js. Leveraging Vue.js reactivity, we’ll create a simple yet powerful solution that allows your … Read more
Responsive design is a cornerstone of modern web development, ensuring that your application adapts gracefully to various screen sizes. In this comprehensive guide, we’ll explore how to achieve easy and reactive access to the width and height of your screen using Vue.js. Leveraging Vue.js reactivity, we’ll create a simple yet powerful solution that allows your … Read more