如何在nuxt3中使用vue日期选择器

olqngx59 于 2023-03-31 发布在 Vue.js

关注(0)|答案(1)|浏览(336)

我尝试使用vue-datepicker（https://vue3datepicker.com/installation/），但没有成功。首先，我在\plugins目录下创建了一个类：（'\plugins\vue-datepicker.js'）

import Datepicker from '@vuepic/vue-datepicker';
  
export default defineNuxtPlugin(nuxtApp => {
  nuxtApp.vueApp.use(Datepicker)
})

然后我尝试在我的应用程序中使用

<Datepicker />

但我犯了个错误

runtime-core.esm-bundler.js:38 [Vue warn]: Failed to resolve component: DatePicker
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.

vue.js

来源：https://stackoverflow.com/questions/73504215/how-use-vue-datepicker-in-nuxt3

1条答案

按热度按时间

dluptydi1#

我不知道是否正确，但它为我工作
plugins/vuedatepicker.js

import VueDatePicker from "@vuepic/vue-datepicker";
import "@vuepic/vue-datepicker/dist/main.css";

export default defineNuxtPlugin((nuxtApp) => {
  nuxtApp.vueApp.component("vue-date-picker", VueDatePicker);
});

index.uve

<template>
  ...
  <vue-date-picker v-model="value"></vue-date-picker>
  ...
</template>

或本地
nuxt.config.ts
参考：https://vue3datepicker.com/installation/#nuxt

export default defineNuxtConfig({
  build: {
    transpile: ["@vuepic/vue-datepicker"],
  },
});

index.vue

<template>
  <vue-date-picker v-model="currentValue"></vue-date-picker>
</template>

<script>
import VueDatePicker from "@vuepic/vue-datepicker";
import "@vuepic/vue-datepicker/dist/main.css";

export default {
  ...
  components: {
    VueDatePicker,
  },
  ...
}
</script>

赞(0）回复(0）举报 2023-03-31

我来回答

如何在nuxt3中使用vue日期选择器

1条答案

相关问题

热门标签

最新问答