vue.js - Vuejs日期选择器不显示任何内容

Question

我尝试使用 vuejs 波斯语日期选择器，但是当我按照自述文件中的说明进行操作时，它什么也没显示！甚至该表单中的所有其他代码都不会显示。我的日期选择器是： VuePersianDatetimePicker cdn 有人可以帮忙吗？在组件中：

import VuePersianDatetimePicker from 'vue-persian-datetime-picker'
export default {
  name: 'GetUserInput',
  data(){
    return {
      date: ''
    }
  },
  components: {
    datePicker: VuePersianDatetimePicker
  }
}
<template><date-picker v-model="date"></date-picker></template>

在 index.html 中：

 <script src="https://cdn.jsdelivr.net/npm/vue"></script>
  <script src="https://cdn.jsdelivr.net/npm/moment"></script>
  <script src="https://cdn.jsdelivr.net/npm/moment-jalaali@0.7.4/build/moment-jalaali.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/vue-persian-datetime-picker/dist/vue-persian-datetime-picker-browser.js"></script>

还安装了软件包。

标签： vue.jsdatetimedatepickervue-componentvue-router

Answer 1

这是一个关于如何VuePersianDatetimePicker使用 CDN的工作示例

var app = new Vue({
    el: '#app',
    data: {
        date: '1400/04/05'
    },
    components: {
        DatePicker: VuePersianDatetimePicker
    }
});

<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script src="https://cdn.jsdelivr.net/npm/moment"></script>
<script src="https://cdn.jsdelivr.net/npm/moment-jalaali@0.7.4/build/moment-jalaali.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue-persian-datetime-picker/dist/vue-persian-datetime-picker-browser.js"></script>

<div id="app">
    <p>selected date is: {{ date }}</p>
    <date-picker v-model="date"></date-picker>
</div>