html

这里的关键点就是   :id="'scroll'+index" 以及 :scroll-into-view="intoIndex"

<view class="week-day-item" v-for="(item,index) in weekList" :key="index"
@click="queryBus(item)" :id="'scroll'+index"
:class="defaultDate.includes(item.date) ? ['active-font'] : (choiceDate.includes(item.date) ? ['active-font'] : '') ">
<view class="week-day">{{item.date}}</view>
<view class="week-day">{{item.week}}</view>
</view>

methods

这里的函数思想就是循环你的日期list,只要选中日期在list有匹配,就把下标给存储到intoIndex,这样 :scroll-into-view 就可以获取到要定位的下标地址了

      // scroll定位
operaDate() {this.weekList.forEach((item, index) => {
if (item.date.includes(this.choiceDate)) {
this.scrollIndex = index
}
})
this.$nextTick(() => {
this.intoIndex = "scroll" + this.scrollIndex
})
this.intoIndex = ''
},

Vue选日期滚动条自动定位到选定的日期位置的更多相关文章

  1. vue 内容增加滚动条自动定位至底部

    this.$nextTick(() => { document.body.scrollTop = document.body.scrollHeight; console.log(document ...

  2. vue 中监测滚动条加载数据(懒加载数据)

    vue 中监测滚动条加载数据(懒加载数据) 1:钩子函数监听滚动事件: mounted () { this.$nextTick(function () { window.addEventListene ...

  3. vue-gemini-scrollbar(vue组件-自定义滚动条)

    vue-gemini-scrollbar(vue组件-自定义滚动条) https://segmentfault.com/a/1190000013338560

  4. vue中关于滚动条的那点事

    vue中关于滚动条的那点事 不知道你有没有遇到过这种情况,有时当页面切换时,滚动条不在页面的顶端.最近半路加入一个项目,就遇到这种情况.(若只是为了解决此问题,可直接翻到最下方)下面谈谈解决此问题的过 ...

  5. OpenJudge计算概论-Tomorrow never knows【输入日期计算下一天的日期】

    /*====================================================================== Tomorrow never knows? 总时间限制 ...

  6. js字符串转日期,js字符串解析成日期,js日期解析, Date.parse小时是8点,Date.parse时间多了8小时

    js字符串转日期,js字符串解析成日期,js日期解析, Date.parse小时是8点,Date.parse时间多了8小时 >>>>>>>>>&g ...

  7. sql生成连续日期(年份、月份、日期)

    此随笔主在分享日常可能用到的sql函数,用于生成连续日期(年份.月份.日期) 具体的看代码及效果吧! -- ============================================= ...

  8. js 日期比较大小,js判断日期是否在区间内,js判断时间段是否在另外一个时间段内

    /** * 日期解析,字符串转日期 * @param dateString 可以为2017-02-16,2017/02/16,2017.02.16 * @returns {Date} 返回对应的日期对 ...

  9. js替换全部,js检查输入的日期是否是一个正确的日期格式

    <script language="javascript"> var str = "我爱的人和爱我的人,我爱的人和爱我的人"; var newstr ...

  10. 通过javascript的日期对象来得到当前的日期,并输出--内置对象---JS

    //通过javascript的日期对象来得到当前的日期,并输出. var mydate = new Date(); var week = ["星期日","星期一" ...

随机推荐

  1. 三天吃透RabbitMQ面试八股文

    本文已经收录到Github仓库,该仓库包含计算机基础.Java基础.多线程.JVM.数据库.Redis.Spring.Mybatis.SpringMVC.SpringBoot.分布式.微服务.设计模式 ...

  2. JavaWeb学习笔记第二弹

    (续集)DQL:查询操作 1.排序查询 排序方式:(仅有一个排序参照时) 1.升序:ASC(默认) 命令:**select * from 表名 order by 列名 (asc);** 2.降序:DE ...

  3. TCP三次握手一二三问

    下面整理下TCP握手和挥手的几个问题,参考资料小林图解计算机网络 1.什么是三次握手? Client端向Server端发送SYN为1的报文段,携带一个初始序列号x,client端进入SYN_SENT状 ...

  4. ACM-NEFUOJ-汉诺塔问题

    P200汉诺塔 #include<bits/stdc++.h> using namespace std; int main() { int n,i; long long s[40]; s[ ...

  5. k8s集群进行删除并添加node节点

    在已建立好的k8s集群中删除节点后,进行添加新的节点,可参考用于添加全新node节点,若新的node需要安装docker和k8s基础组件. 建立集群可以参考曾经的文章:CentOS8 搭建Kubern ...

  6. python类详解

    类封装 继承 多态一静态属性1.静态变量和静态方法都属于类的静态成员,它们与普通的成员变量和成员方法不同,静态变量和静态方法只属于定义它们的类,而不属于某一个对象.2.静态变量和静态方法都可以通过类名 ...

  7. SELECT COUNT(*) 会造成全表扫描?回去等通知吧

    本文已经收录到Github仓库,该仓库包含计算机基础.Java基础.多线程.JVM.数据库.Redis.Spring.Mybatis.SpringMVC.SpringBoot.分布式.微服务.设计模式 ...

  8. FBV和CBV的区别(源码分析)

    FBV和CBV源码分析 FBV直接调用user方法执行业务代码 CBV相当于在FBV上面封装了一层 from django.contrib import admin from django.urls ...

  9. java项目 学生成绩管理系统 (源码+数据库文件)

    ​ 需要的私信我 备注来意:项目名称 来了就点个赞再走呗,即将毕业的兄弟有福了 文章底部获取源码 java项目  学生成绩管理 (源码+数据库文件)技术框架:java+springboot+vue+m ...

  10. Junit启动测试mybatis xml文件BindingException: Invalid bound statement问题

    背景:1.正常启动,xml文件放在java目录和resource目录下均正常 2.junit启动,xml文件放在resource目录下正常,放在java目录下报BindingException错误 m ...