本插件由博主自主开发,比uni插件市场的城市列表滑动组件性能好,且不会出现闪屏的情况。

通过计算城市列表的高度实现滚动到指定位置,使用了uni滚动到指定位置的api

city-chooce为页面入口页,引入文件路径需要自己更改

citySelect.js文件为拼音检索 目前是没有引入使用 有需要使用自取

链接:https://pan.baidu.com/s/1yBO0dqhfmXzITmWrMRI0ng
提取码:z05u

其他需求也可以自己添加,如有不懂的或者需要二级市下面的区县数据请+博主Q 851689968

uni-城市列表滑动组件,点击字母跳转到指定位置的更多相关文章

  1. UITableView——点击某一行移动到指定位置

    选中某一行后想要tableView自动滚动使得选中行始终处于table的top.middle或者bottom,使用以下方法中的一个就可以实现: [tableView scrollToRowAtInde ...

  2. 微信小程序实现按首字母检索城市列表

    不说废话,上效果图 因为我有多处要用到,所以我这里是写成自定义组件的,你也可以直接改成在page页面编写: 布局左边一个scroll-view,显示城市列表,右边一个view显示字母列表,城市列表这边 ...

  3. vue 城市列表与字母表联动

    实现两个联动 一是点击右侧字母的时候,城市列表出现相应首字母下的城市 二是鼠标在字母表上滑动的时候,城市列表实时跟着变化 一.点击字母出现相应的列表,给每个字母设置handleLetterClick事 ...

  4. vue-cli 3.0 实现A-Z字母滑动选择城市列表

    项目地址: https://github.com/caochangkui/vue-cli3 项目代码: 城市列表首页: City.vue <template> <div id=&qu ...

  5. Vue2.5开发去哪儿网App 城市列表开发之 兄弟组件间联动及列表性能优化

    一,  兄弟组件间联动 1.  点击城市字母,左侧对应显示 给遍历的 字母 添加一个点击事件: Alphabet.vue @click="handleLetterClick" ha ...

  6. Android例子源码非第三方实现根据字母排序的城市列表

    values 下dimens.xml <resources> <!-- Default screen margins, per the Android Design guidelin ...

  7. vue实现城市列表选择

    成果展示 最后的成果就是下面所展示的内容,因为gif图没有做,只能截图所展示,接下来,会带着大家一步一步的完成下面功能,脚手架搭建和node安装在本次案例不会讲解,如果了解,可以在我的博客园找到有详细 ...

  8. 【微信小程序】手写索引选择器(城市列表,汽车品牌选择列表)

    摘要: 小程序索引选择器,点击跳转相应条目,索引可滑动,滑动也可跳转 场景:城市选择列表, 汽车品牌选择列表 所用组件: scroll-view(小程序原生) https://developers.w ...

  9. [RN] 全国城市列表选择 (包含定位城市、热门城市、全国城市)

    全国城市列表选择 (包含定位城市.热门城市.全国城市) 用ScrollView 实现,解决 SectionList 实现的卡顿问题 实现效果如图: 代码实现如图: 主逻辑文件 cityList.js ...

随机推荐

  1. vue three.js 结合tween.js 实现动画过渡

    参考地址:https://www.jianshu.com/p/d6e3b4b153bb https://www.jqhtml.com/10513.html 官方文档:https://github.co ...

  2. Python-对Pcap文件进行处理,获取指定TCP流

    通过对TCP/IP协议的学习,本人写了一个可以实现对PCAP文件中的IPV4下的TCP流提取,以及提取指定的TCP流,鉴于为了学习,没有采用第三方包解析pcap,而是对bytes流进行解析,其核心思想 ...

  3. Git:分布式版本控制系统

    参考廖雪峰的 Git 教程:https://www.liaoxuefeng.com/wiki/896043488029600  讲解很详细,这里只做一些个人笔记: 各系统安装 Git :https:/ ...

  4. 03 依赖注入--01控制反转、IoC模式

    控制反转Inversion of Control DI和IoC几乎都是成对出现的,我们在理解依赖注入之前首先要弄明白什么是IoC,也就是控制反转,体现的就是控制权的转移,即控制权原来在A中,现在需要B ...

  5. join方法个人理解

    首先抛出对join的疑问 如果我有一个a线程,一个b线程 那此时 a.start(); b.start(); a.join(); b.join(); 是否意思是a线程先执行完,然后再执行b线程; 如果 ...

  6. Angular 的性能优化

    目录 序言 变更检查机制 性能优化原理 性能优化方案 小结 参考 序言 本文将谈一谈 Angular 的性能优化,并且主要介绍与运行时相关的优化.在谈如何优化之前,首先我们需要明确什么样的页面是存在性 ...

  7. minikube addons enable ingress 启动错误

    minikube addons enable ingress 启动错误 开启 minkube ingress 时错误 minikube addons enable ingress --alsologt ...

  8. eclipse下载安装

    1.下载 网址:https://www.eclipse.org/downloads/ 找到:eclipse-inst-jre-win64.exe 下载... 2.安装 找到-->Eclipse ...

  9. C++学习笔记:07 类的继承与派生

    课程<C++语言程序设计进阶>清华大学 郑莉老师) 基本概念 继承与派生的区别: 继承:保持已有类的特性而构造新类的过程称为继承. 派生:在已有类的基础上新增自己的特性(函数方法.数据成员 ...

  10. Spring Boot 整合单机websocket(附github源码)

    websocket 概念 websocket 是一个通信协议,通过单个 TCP 连接提供全双工通信.websocket 连接成功后,服务端和客户可以进行双向通信.不同于 http 通信协议需要每次由客 ...