Components:

<template>
  <a-range-picker
    :showTime="showTime"
    @change="onChange"
    @ok="onOk"
  ></a-range-picker>
</template>

<script>
import moment from "moment";
export default {
  data() {
    return {
      showTime: {
        format: "HH:mm:ss".defaultValue: [
          moment("00:00:00"."HH:mm:ss"),
          moment("23:59:59"."HH:mm:ss"),]}}; },methods: {
    onChange(value, dateString) {
      console.log("Selected Time: ", value);
      console.log("Formatted Selected Time: ", dateString);
    },
    onOk(value) {
      console.log("onOk: ", value);
      console.log(value.map((item) = > item.format("YYYY-MM-DD HH:mm:ss"))); ,}}};</script>

<style scoped>
</style>
Copy the code

Internationalization:

<template>
  <div id="app">
    <a-config-provider :locale="zhCN">
      <router-view/>
    </a-config-provider>
  </div>
</template>

<script>
import zhCN from 'ant-design-vue/es/locale-provider/zh_CN.js'
export default {
  data() {
    return {
      zhCN
    }
  },
}

</script>
Copy the code

The main. Js introduction:

import Vue from 'vue'
import App from './App.vue'
import Antd from 'ant-design-vue'
import router from './router'
import store from './store'
import 'ant-design-vue/dist/antd.css'
import './font/iconfont.css'
import './index.css'

Vue.use(Antd)
Vue.config.productionTip = false

new Vue({
  router,
  store,
  render: h= > h(App)
}).$mount('#app')
Copy the code

 

 

 

Reference links:

www.antdv.com/components/…

momentjs.cn/