27-Mar-2021
.
Admin
Hi Guys,
Today, I will learn you how to use datepicker in vuejs?. We will show example of datepicker in vuejsif you need to use datepicker in vue js then I will give you a simple example of vuejs datepicker, so you can also use with bootstrap 3 or bootstrap 4 app. you can also use with php laravel vue js app for datepicker.
I will write a very simple step to use datepicker with vuejs app. vuejs-datepicker provide datepicker component. vuejs-datepicker provide several options like name, value, id, format, language, placeholder, inline-class etc.
Step 1: Create Vue App
Now In this step, we need to create vue cli app using bellow command.
vue create myApp
Step 2: Install vuejs-datepicker Package
In this step, we need to install vuejs-datepicker npm package that will allow to use datepicker component.
npm install vuejs-datepicker --save
Step 3: Use vuejs-datepicker in App.vue
Here i will give you very simple use to vuejs-datepicker and then we will use datepicker. so let's replace code of App.vue file.
src/App.vue
<template>
<div id="app">
<img alt="Vue logo" src="./assets/logo.png">
<datepicker name="birthdate"></datepicker>
</div>
</template>
<script>
import Datepicker from 'vuejs-datepicker'
export default {
name: 'app',
components: {
Datepicker
}
}
</script>
Now you can run vue app by using following command:
npm run serve
It will help you..
#Vue.Js
#Vue