每周日历无法正确显示事件。甚至是来自的片段代码https://vuetifyjs.com/en/components/calendars https://vuetifyjs.com/en/components/calendars还给我一个空日历。我想使用该功能，但我找不到以下代码片段出了什么问题。
我注意到模板 v-slot:dayHeadere 中存在拼写错误，并将其修复为 dayHeader。尽管如此，还是不行。
<div id="app">
<v-app id="inspire">
<v-layout>
<v-flex>
<v-sheet height="400">
<!-- now is normally calculated by itself, but to keep the calendar in this date range to view events -->
<v-calendar
ref="calendar"
:now="today"
:value="today"
color="primary"
type="week"
>
<!-- the events at the top (all-day) -->
<template v-slot:dayHeader="{ date }">
<template v-for="event in eventsMap[date]">
<!-- all day events don't have time -->
<div
v-if="!event.time"
:key="event.title"
class="my-event"
@click="open(event)"
v-html="event.title"
></div>
</template>
</template>
<!-- the events at the bottom (timed) -->
<template v-slot:dayBody="{ date, timeToY, minutesToPixels }">
<template v-for="event in eventsMap[date]">
<!-- timed events -->
<div
v-if="event.time"
:key="event.title"
:style="{ top: timeToY(event.time) + 'px', height: minutesToPixels(event.duration) + 'px' }"
class="my-event with-time"
@click="open(event)"
v-html="event.title"
></div>
</template>
</template>
</v-calendar>
</v-sheet>
</v-flex>
</v-layout>
</v-app>
</div>
该代码片段是直接从 vuejs 网站保存的。 （当我保存它时，它至少无法正常工作）。
我希望事件能够正确显示。如果有人尝试使用此每周日历并成功，请告诉我如何解决它。我将不胜感激！
只需更换v-slot by slot and 槽范围在你的<template>:
Replace
<template v-slot:dayHeader="{ date }">
and
<template v-slot:dayBody="{ date, timeToY, minutesToPixels }">
by
<template slot="dayHeader" slot-scope="{ date }">
and
<template slot="dayBody" slot-scope="{ date, timeToY, minutesToPixels }">
这是一个正在运行的代码笔：https://codepen.io/anon/pen/ErPZrK https://codepen.io/anon/pen/ErPZrK
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
