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. vue2+element表格拖拽

    1.定义好拖拽元素 ref标识,以及 row-key="id"  (row-key拖拽标识,拖拽后数据不会乱, id为tableDataNew数据对象id) 2.下载cnpm in ...

  2. IDEA学生认证的步骤详解

    步骤详解 在上次使用学生认证的方法对jetbrains认证成功之后,咱们在IDEA这里认证一下吧! 一.点击help这里的register 如图所示: 进入这样一个界面: 然后点击左下角的的Log I ...

  3. JavaWeb学习笔记第三弹

    一.数据库设计 1.软件研发步骤 2.数据库设计概念 建立数据库中的表结构以及表与表之间的关联关系的过程 3.数据库设计的步骤 表关系:一对一.一对多(多对一).多对多 表关系之一对多 表关系之多对多 ...

  4. 当基础设施故障后,声网 SD-RTN™ 如何保障 RTE 服务的高可用性

    云计算的出现为企业的管理.业务开展.资源整合等带来了极大的便利性,也是数字化建设的核心基建之一,然而局部宕机或者大面积宕机事件对于云厂商来说却也无法避免,全球领先的计算平台也不例外.例如,美国东部时间 ...

  5. Mybatisplus----DML编程---多记录操作

    批量处理数据: @Test void testDelete(){ //批量按id删除 List<Long> list = new ArrayList<>(); list.add ...

  6. 创建镜像发布到镜像仓库【不依赖docker环境】

    image 工具背景 如今,docker镜像常用于工具的分发,demo的演示,第一步就是得创建docker镜像.一般入门都会安装docker,然后用dockerFile来创建镜像,除此以外你还想过有更 ...

  7. Edge解决默认Bing搜索跳转到国内版的问题

    近期BingGPT申请通过以后,每次用PC端Edge去跳转的时候不管是否念Proxy咒都会进入国内版本Bing,排查得到默认Bing参数如下 因此,在edge://settings/searchEng ...

  8. 一文彻底搞懂Raft算法,看这篇就够了!!!

    最近需要设计一个分布式系统,需要一个中间件来存储共享的信息,来保证多个系统之间的数据一致性,调研了两个主流框架Zookeeper和ETCD,发现都能满足我们的系统需求.其中ETCD是K8s中采用的分布 ...

  9. LeeCode 1832 找出游戏的获胜者

    LeeCode 1832 题目描述: 共有 n 名小伙伴一起做游戏.小伙伴围成一圈,按顺时针顺序从1到n编号.确切地说,从第 i 名小伙伴顺时针移动一位会到达第 (i+1) 名小伙伴的位置,其中 1 ...

  10. Semantic Kernel 入门系列:💬Semantic Function

    如果把提示词也算作一种代码的话,那么语义技能所带来的将会是全新编程方式,自然语言编程. 通常情况下一段prompt就可以构成一个Semantic Function,如此这般简单,如果我们提前可以组织好 ...