效果图:

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. CTF中压缩文件的常见解法

    此篇记录两篇记录的比较好的关于压缩文件破解的总结 链接:https://blog.csdn.net/xuqi7/article/details/71437882 https://blog.csdn.n ...

  2. create_function()代码注入

    00x00create_function()函数的简介 适用范围:PHP 4> = 4.0.1,PHP 5,PHP 7 功能:根据传递的参数创建匿名函数,并为其返回唯一名称. 语法: creat ...

  3. OrCAD Capture CIS绘制原理图、Allegro PCB Design XL 绘制PCB

    1.OrCAD Capture CIS绘制原理图 1.1.快捷键 (1)放置连线         w (2)放置net名称      n     放下一个时再按n可以编辑名字 (3)编辑属性      ...

  4. H3C ARP配置

    一.ARP简介 ARP(Address Resolution Protocol,地址解析协议)是将IP地址解析为以太网MAC地址(或称物理地址)的协议. 在网络中,当主机或其它网络设备有数据要发送给另 ...

  5. flask入门(三)

    表单 request.form 能获取POST 请求中提交的表单数据.但是这样不太安全,容易受到恶意攻击.对此,flask有一个flask-wtf扩展,用于避免这一情况 在虚拟环境下用pip inst ...

  6. c# Gridview 自动分页功能 解决后面页面不显示问题

    操作步骤: 操作如下: 1.更改GrdView控件的AllowPaging属性为true. 2.更改GrdView控件的PageSize属性为 任意数值(默认为10) 3.更改GrdView控件的Pa ...

  7. JavaDay1(上)

    Java learning_Day1(上) 一切准备工作已经做好,虽然自己之前也零零碎碎学了一些Java的基础知识,貌似现在忘得差不多了,趁寒假契机从头开始学习吧 本人学习视频用的是马士兵的,也在这里 ...

  8. python多线程返回值的实现与处理

    题目: # 编写一个python程序,创建两个子线程,分别到下面的网址获取文本内容# http://mirrors.163.com/centos/6/isos/x86_64/README.txt# h ...

  9. Mybatis- 基础知识

        mybatis是一个java持久层框架,java中操作关系型 数据库用的是jdbc,mybatis是对jdbc的一个封装. 简介 iBATIS一词来源于"internet" ...

  10. Git push 报错error: failed to push some refs to 'git@github.com'

    出错原因 当我们在github版本库中发现一个问题后,你在github上对它进行了在线的修改:或者你直接在github上的某个库中添加readme文件或者其他什么文件,但是没有对本地库进行同步.这个时 ...