Vue2 的日期选择组件 vue-datepicker-local

vue-datepicker-local 详细介绍Vue2一个漂亮的日期选择组件：仅依赖于Vue轻量级（小于4kb的压缩包）美观使用安装$ npm install vue-datepicker-localES6<template> <vue-datepicker-local v-model="time" />...

phj_88

4341人浏览 · 2018-07-27 08:22:02

phj_88 · 2018-07-27 08:22:02 发布

vue-datepicker-local 详细介绍

Vue2一个漂亮的日期选择组件：

仅依赖于Vue
轻量级（小于4kb的压缩包）
美观

使用

安装

$ npm install vue-datepicker-local

ES6

<template>
  <vue-datepicker-local v-model="time" />
</template>

<script>
import VueDatepickerLocal from 'vue-datepicker-local'

export default {
  components: {
    VueDatepickerLocal
  },
  data () {
    return {
      time: new Date()
    }
  }
}
</script>

浏览器全局

dist文件夹包含了 vue -datepicker- local.js 和 vue-datepicker-local.css。

<!DOCTYPE html>
<html>
<head>
  <link rel="stylesheet" href="path/to/vue-datepicker-local.css">
</head>
<body>
  <div id="app">
    <vue-datepicker-local v-model="time"></vue-datepicker-local>
  </div>
  <script src="path/to/vue.js"></script>
  <script src="path/to/vue-datepicker-local.js"></script>
  <script>
    new Vue({
      el: "#app",
      data: {
        time: new Date()
      }
    })
  </script>
</body>
</html>

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^