vue日期时间选择插件
Vue波斯日期时间选择器 (vue-persian-datetime-picker)
A vue plugin to select jalali date and time.
一个vue插件来选择jalali日期和时间。
正在安装 (Installing)
npm install vue-persian-datetime-picker --save
webpack.config.js:
webpack.config.js:
/**
* configuration for moment to ignore loading locales
*/
module.exports.plugins = [
//...
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/)
//...
]
用法 (Usage)
main.js
main.js
//...
import VuePersianDatetimePicker from 'vue-persian-datetime-picker';
Vue.component('date-picker', VuePersianDatetimePicker);
//...
Or in component
或在组件中
<template>
<div>
<date-picker v-model="date"></date-picker>
</div>
</template>
<script>
import VuePersianDatetimePicker from 'vue-persian-datetime-picker'
export default {
data(){
return {
date: ''
}
},
components: {
datePicker: VuePersianDatetimePicker
}
}
</script>
您还可以设置默认值: (You can also set default values:)
main.js
main.js
import VuePersianDatetimePicker from 'vue-persian-datetime-picker';
Vue.use(VuePersianDatetimePicker, {
name: 'custom-date-picker',
props: {
inputFormat: 'YYYY-MM-DD HH:mm',
format: 'jYYYY-jMM-jDD HH:mm',
editable: false,
inputClass: 'form-control my-custom-class-name',
placeholder: 'Please select a date',
altFormat: 'YYYY-MM-DD HH:mm',
color: '#00acc1',
autoSubmit: false,
//...
//... And whatever you want to set as default
//...
}
});
Then use in component
然后在组件中使用
<custom-date-picker v-model="date"></custom-date-picker>
翻译自: https://vuejsexamples.com/a-vue-plugin-to-select-jalali-date-and-time/
vue日期时间选择插件