首页 > 解决方案 > Vuetify - 更改日历月组件的每个日期的颜色

问题描述

我想使用日历月组件显示员工的出勤状态。

<v-calendar type="month" :value="###">
          <template v-slot:day="{ present, past, date }">
            <v-row no-gutters style="height:2.5rem">
              <template v-if="events[date]">
                <v-col class="text-center">
                  <v-chip
                    label
                    dark
                    @click="###"
                    :title="###"
                    :color="###"
                    v-for="###"
                    :key="i"
                  >{{###}}</v-chip>
                </v-col>
              </template>
            </v-row>
          </template>
        </v-calendar>

每个插槽都包含代表另一个数据的芯片。因此,要显示员工的出勤状态(在场或缺席),我想更改日期的颜色。有没有办法做到这一点,或者任何其他关于如何实现此功能的建议将不胜感激。

标签: javascriptvue.jsvuetify.js

解决方案


推荐阅读