vue日历上每天的日程安排表

最新推荐文章于 2025-08-22 13:21:31 发布

原创

最新推荐文章于 2025-08-22 13:21:31 发布 · 3.1k 阅读

28 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #前端 #javascript #日历 #日程 #calendar #elementui

在这里插入图片描述

结合了vue-calendar-component和Element UI的table组件。

npm install vue-calendar-component  --registry=https://registry.npmmirror.com

点击一天，切换table数据。
在这里插入图片描述

<template>
    <div>
        <div class="con">
            <Calendar v-on:choseDay="clickDay" v-on:changeMonth="changeDate" v-on:isToday="clickToday"></Calendar>
        </div>

        <el-table
      :data="tableData"
      style="width: 100%">
      <el-table-column
        prop="date"