日历组件如何在页面中使用

嗷呜~小脑斧

已于 2022-10-14 11:24:32 修改

阅读量100

点赞数 1

文章标签： javascript 前端 html vue vue.js

于 2022-10-14 11:21:21 首次发布

本文链接：https://blog.csdn.net/weixin_46939404/article/details/127316982

版权

本文将介绍如何在Vue.js前端项目中利用HTML和JavaScript构建并集成一个功能完善的日历组件，详细阐述了从HTML结构搭建到JavaScript事件处理的全过程。

摘要由CSDN通过智能技术生成

1.html

<template>
  <div class="container">

    <div class="calenderBox">
      <ByCalender ref="calender" :defaultValue="calenderValue" :visible="calenderShow" :format=" 'yyyy 年 MM 月' " :format-value="'yyyy-MM-dd'" @clickCalCB="clickCalResp" @clickMonBtnCB="clickMonBtnResp"/>
    </div>

  </div>
</template>

2.javascript

<script>
/* eslint-disable */
import ByCalender from "../components/calender";
export default {
  name: "CustManager",
 components: {
    ByCalender
  },
  data() {
    return {
      calenderValue:'',
      calenderShow:true
    }
  },
  created(){
    this.setCalenderValue()
    // this.cellPPTop = document.querySelector('.active').offsetTop
  },
  moun