效果图:

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. Python中matplotlib模块的简单使用

    测试代码如下: # encoding:utf-8 import numpy as np import matplotlib.pyplot as plt x = np.array([1,2,3,4,5, ...

  2. C# Enumerable

    使用Enumerable.Range 打印数字0到9 static void Main(string[] args) { , ); //Range方法获取两个int参数:一个起始数,一个是要生成的结果 ...

  3. Appium学习2-Appium-desktop的使用

    安装: 下载路径:https://github.com/appium/appium-desktop/releases 选择最新的安装包即可. 使用 1.点击打开应用程序,进入到配置项. 2.配置以下信 ...

  4. C# asp.net 配置文件连接sql 数据库

    先引用 using System.Configuration;//配置文件using System.Data.SqlClient; 我这里使用的是SqlServer 2008  sa 用户 密码也为s ...

  5. View -->Controller传值的几种方法

    1.参数名称必须和表单的name是一致的. //参数的名称需要和表单的字段名称一致,这样系统便会直接赋值. public ActionResult GetUserInfo(string usernam ...

  6. 0007 settings.py配置文件详解

    01 DEBUG调试配置 开发期设置为True,发布时设置为False 02 INSTALLED_APPS已安装的APP配置 INSTALLED_APPS = [ 'django.contrib.ad ...

  7. 题解【洛谷P1725】琪露诺

    题面 典型的单调队列优化\(\text{DP}\)题. 不难想到设\(dp_i\)表示以\(i\)结尾能得到的最大冰冻指数. 这样设的转移方程也很简单:\(dp_i=\max\left\{ dp_j+ ...

  8. Codeforces Round #614 (Div. 2) A-E简要题解

    链接:https://codeforces.com/contest/1293 A. ConneR and the A.R.C. Markland-N 题意:略 思路:上下枚举1000次扫一遍,比较一下 ...

  9. python如何离线装包 离线如何部署python环境

    1,安装python windows: 我用的是python3.6.6.exe安装包,需要提前下载好 ubuntu: 自带的python,如果是ubuntu18.04的话,自带的应该是3.6.8 2, ...

  10. 一个仿tp5分页组件的实现

    样式: a{ text-decoration: none; color: inherit; } .out-cp{ width:100%; text-align: center; } .c-page{ ...