效果图:

html 显示部分:

js 显示部分:

    preNextBtn(val){
let _this = this;
this.tableList = []; //数据重置为空
_this.showTips = false; //显示loading let fieldValue = this.yearNum;
let yearStart = new Date(parseInt(fieldValue),0,1) //设置该年1.1.
let firstDay = yearStart.getDay(); //星期
let yearEnd = new Date(parseInt(fieldValue),11,31) //设置该年12.31.
let endDay = yearEnd.getDay(); //星期
//-------------------------------------------------------------------------------------
//判断输入是否超过最大周次.
let maxWeek; //该年最大周次.1.1.在周一到周四,则为该年第一周,否则为上年最后一周.
if((firstDay>=1&&firstDay<=4)&&(endDay==0||endDay==4||endDay==5||endDay==6))
{
maxWeek = 53; //1.1.和12.31.都在本年,则该年有53周,否则52周
}else
{
maxWeek = 52;
} if(val == "pre"){ //上一周
this.pretweek = Number(this.weekNum)-1;
if(this.pretweek <= 0){ //如果上一周小于0 ,年份减一,最大周减1
this.yearNum = Number(this.yearNum) -1;
this.pretweek = maxWeek - 1;
}
this.getTbaleData(_this.yearNum,this.pretweek)
}else{ //下一周
this.nextweek = Number(this.weekNum)+1;
if(this.nextweek>maxWeek){ //如果下一周大于当年最大周 ,年份加一,从第一周开始
this.yearNum = Number(this.yearNum)+1;
this.nextweek = 1
}
this.getTbaleData(_this.yearNum,this.nextweek)
}
},

vue 实现上一周、下一周切换功能的更多相关文章

  1. Unity上一页下一页切换功能实现源码(仅供参考)

    在做项目时我们有时需要实现切换上一页下一页图片,切换上一首下一首歌曲等等类似的功能.这里写了个简单的实现源码(仅供参考),要是有更好的方法欢迎提出来,共同进步~ 以切换上一页下一页图片为例: usin ...

  2. c#上一周下一周代码

    public partial class Form1 : Form { DateTime dtNow; public Form1() { InitializeComponent(); } privat ...

  3. 使用Charles请求跳转可作为线上和线下环境的切换

    举个例子: 1.后端拿测试环境的客户端调试本地的代码 2.连接后端本地服务测试客户端和后端的交互 这样就可以改变客户端请求的测试环境换成其他的环境 一.配置 tools--Map remot... 这 ...

  4. 使用vue开发微信公众号下SPA站点的填坑之旅

    原文发表于本人博客,点击进入使用vue开发微信公众号下SPA站点的填坑之旅 本文为我创业过程中,开发项目的填坑之旅.作为一个技术宅男,我的项目是做一个微信公众号,前后端全部自己搞定,不浪费国家一分钱^ ...

  5. vue图片上传

    之前花了两个月用vue做了一个建筑照片我的webApp,前端就我一人,负责用vue写页面对接接口,后台一个程序员负责写接口,嵌套个安卓ios的壳.搞的是风风火火,过程也是很心累,大多不在技术,在于所谓 ...

  6. js 获取每月有几周,根据年月周获取该周从周一到周日的日期等方法

    本文基于react-native 本人在用react-native写一个关于课程表的APP时需要课程表按照日期周期显示,网上查了许多方法,都没有达到自己想要的效果,根据一些方法的参考,再根据自己思维写 ...

  7. 20181023-4 Beta阶段第1周/共2周 Scrum立会报告+燃尽图 01

    作业要求:[https://edu.cnblogs.com/campus/nenu/2018fall/homework/2383] 版本控制:[https://git.coding.net/lglr2 ...

  8. 20182310 第二周&第三周学习总结

    20182310 2019-2020-1 <数据结构与面向对象程序设计>第2周&第3周学习总结 教材学习内容总结 1.首先是String类定义的字符串,然后是print和print ...

  9. 关于vue+axios上传文件的踩坑分析

    上传文件是每个前端开发者都会遇到的问题,在之前实习期做了一个上传文件的功能,当时没有彻底搞明白问题所在,现在重新复盘下. 1.使用formData来上传文件,没有使用axios上传文件,之前在学校有做 ...

随机推荐

  1. 从0开始学算法--排序(1.12c++利用标准库排序)

    1,简单数组按升序排序 sort(a,a+n); #include <algorithm> #include <iostream> #include <cstring&g ...

  2. Babel 7 主要改变

    1.不支持Node:0.10,0.12,4,5版本 2.更换命名-@babel/xxx 3.移除以年份命名的presets,统一更换成@babel/preset-env 4.移除 ’Stage‘ pr ...

  3. java通过浏览器请求头(User-Agent)获取访问者设备信息以及系统版本

    个人博客 地址:http://www.wenhaofan.com/article/20181125220342 在开发AutuBlog项目时需要做后台的登录记录,想起浏览器的User-Agent,于是 ...

  4. spring security和java web token整合

    思路: spring security 1.用户输入用户名密码. 2.验证:从库中(可以是内存.数据库等)查询该用户的密码.角色,验证用户名和密码是否正确.如果正确,则将填充Authenticatio ...

  5. mybatis(二):缘由

    本是Apache的一个开源项目iBatis 2010年,iBatis由Apache Software Foundation(软件基金会)迁移到了Google Code(代码托管平台),并改名为MyBa ...

  6. python:删除文件及文件夹

    #!/usr/bin/python# -*- coding:utf-8 -*- import os import shutil os.remove(path) #删除文件shutil.rmtree(p ...

  7. 巨杉Tech|SequoiaDB 巨杉数据库高可用容灾测试

    数据库的高可用是指最大程度地为用户提供服务,避免服务器宕机等故障带来的服务中断.数据库的高可用性不仅仅体现在数据库能否持续提供服务,而且也体现在能否保证数据的一致性. SequoiaDB 巨杉数据库作 ...

  8. 1052 Linked List Sorting (25分)

    题目 1. 思路 使用map存放所有的地址对 使用起始地址遍历map,结果存放在vector中 排序vector 输出vector 2. 注意点 开始的时候起始地址为-1 可能有些节点没有用到,注意排 ...

  9. 地铁合作(hjy)

       用时大概时间 18 个小时  我的队友是 :黄珺瑜我们一开始的想法是自己建立数据库,用来查询路线,再调用一下百度api作为地图(仅作地图没有任何操作的那种):后来我们的步骤也的确是这样,我们先确 ...

  10. js清空子节点

    删除全部子节点 function removeAllChild(){ var div = document.getElementById("div1"); while(div.ha ...