Vue实现有价格日历

1.分析

*上面月份是一部分

*下面的日期是一个整体


*根据获取到的数据先获取到有几个月

*再给每个月赋值

*月份切换时修改数据,在下面部分根据切换的数据使用v-if来实现切换

2.代码实现

canlender.vue

template:

script:

data中:


数据处理完成,把分组好的数组传到cell-month中:

cell-month.vue

template:

script:


主要的几个方法就是

1.要把月份抽取出来,然后去重,显示一共有几个月

2.在显示每个月的信息时,要根据穿过来的年月,判断这个月共有几天

3.判断每个月的1号是周几,然后再插到相应的周几之下

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 女人“败家”,并不会像人们想象的那样,让整个家庭过不下去。相反,女人败家还会让婚姻更加幸福。 好处一:女人败家,才...
    邱敏V塑缔造你的美丽阅读 3,800评论 0 1
  • 太多的事不受人控制,所以人才会有失去的痛苦,而失去之事中,应该说只有平白地失去最爱的人,或者生命,才真正称得上是至...
    陈烙阅读 1,911评论 0 2
  • 日出和日落在他的感情经历中有着非比寻常的意义。这感情就像他的胡须,最初的同绒毛般柔滑,积年累月;剃去后再生出的就全...
    雪城不下雪阅读 3,085评论 0 3
  • 第一话 安然,我们要毕业了,今天你跟我说,你到一家知识产权公司报道了,我问你这公司是做什么的,你轻轻一笑,是做...
    yummy_love阅读 1,833评论 0 0