首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

VUE开发一个组件——Vue H5城市选择控件

前言 昨天用《VUE开发一个组件——Vue PC城市选择控件》 , 有朋友说需要用字母筛选,其实已经用字母筛选了,不过是每4个,没有对单个,所以H5我们就用单个字母快速查找。 ?...数据部分 和《VUE开发一个组件——Vue PC城市选择控件》 一样,但是不需要每4个再分组了。...activeKey}} search没有开发(用关键字搜索)、city-list遍历cityListData、filter筛选字母列表、active-key提示当前选择是那个字母...; border-radius: 100%; text-align: center; font-size: 40px; } } 这里的.block-60主要是用来占位,不然城市会被上方的搜索框盖住...源码地址:vue-c-city 如果要PCH5互换,需要修改main.js里面的代码。

2.2K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    vue实现省份城市选择

    之前都是后端操作的,城市数据都是存在数据库的,前端选择然后去后端查的,比较简单方便。这次开发的是前端,客户没有提供城市选择的接口,省市这些数据感觉还是放在数据库后端操作较好。...$refs.resetCountry.reset(); /*写在提交方法中,从组件中获取选择的值*/ var country = that....$refs.resetCountry.changeValueCity() 因为有多个页面需要使用,所以把选择城市的封装成atom-city组件,我这个需求是有选择国家的,如果选择的是中国才会有省份城市选择框...: function(event){                 return this.selectCity             }   } } 其他方式参考: vue.js...省份城市联动选择实现示例(通过vue数组过滤) 基于vue2实现省市联动

    2.7K20

    程序员如何选择城市工作?

    一线城市:北上广深 准一线城市:成都、杭州、重庆、武汉、西安、苏州、天津、南京、长沙、郑州、东莞、青岛、沈阳、合肥、佛山。 我原来写过一篇话题讨论,话题讨论 | 你选择去一线城市还是老家的省会城市?...当时的结论是,如果追求职业发展,就选择一线城市。如果追求生活幸福感高一些,选择准一线城市也不错。像杭州、南京已经不比广州差了。 总体上是这样推荐,但对应个体上就不一样。...对于新入职场的朋友,我认为你要坚定的选择一线城市。追求幸福对你来说太早了。没有家庭,你的经济压力会小很多,如果你还单身,你的自由时间会有很多,这些时间怎么花?用在学习和加班上。...你应该想办法选择“我都要”。 2021年的程序员的薪资数据已经出来了,北上深杭的最高工资45000,中位数也有15000 - 16500。这是重点推荐的城市。...只有到了这个时候,为了提高生活幸福感,去准一线城市或省会城市也是不错的选择。我很多同事,在一线城市工作,老家省会买房。等孩子大了后,就会选择回省会工作,虽然工资少了点,但工作没有那么忙碌,幸福感剧增。

    1K10

    android wheelview实现三级城市选择

    很早之前看淘宝就有了ios那种的城市选择控件,当时也看到网友有分享,不过那个写的很烂,后来(大概是去年吧),我们公司有这么一个项目,当时用的还是网上比较流行的那个黑框的那个,感觉特别的丑,然后我在那个开源的...接下来说下我的思路:网络请求-数据返回-设置数据-数据填充控件 接下来直接按上面的流程直接上代码: 网络请求我用的本地的json数据 ?...e.printStackTrace(); } return resultString; } 接下来我们写自定义的Popwindos实现选择城市的弹框...int oldValue, int newValue) { if (wheel == provinceWheel) { updateCitiy();//省份改变后城市和地区联动...} else if (wheel == cityWheel) { updateDistrict();//城市改变后地区联动 } else if

    2.3K60

    【react】开发一款城市选择组件

    想到做这个,是因为无意中在github上看到了这一个仓库https://github.com/lunlunshiwo/ChooseCity,做的就是一个城市选择控件,是用vue写的,说的是阿里的一道题目...演示 地址:城市选择控件 github: https://github.com/Rynxiao/city-selector 整体效果如下: ?...下次打开优先选取上次定位城市,如本次定位和上次不一样,则取本地城市,同时展示最近选择城市,最近选择城市可配 城市列表按字母分组,如B组:北京、包头,同时左侧带A-Z导航符条,点击对应字母定位至对应的组位置...,后选择城市会替换掉第一个,如果选择城市中有相同的,则不进行替换。...后来只能就部署到自己的腾讯云上面去了,案例地址为:城市选择控件 总结 自己看到后就想写来玩玩而已,在其中也进一步了解了测试、react-router 4的用法,以及蚂蚁金服的UI库,也不是说没有收获。

    3.9K30

    uni-app: 根据定位获取天气(附城市控件)

    1、Uni-App 测试数据封装 2、Uni-App 城市控件(Uni-App元素操作相关) 3、ES6 多种遍历方式区别 ? 要源码的同学,购买后可以私信我。...下面我们来具体看看: Uni-App 测试数据封装 城市控件,我们就查询接口了,根据高德提供的城市数据,我们进行处理后,放到一个文件中。...$api.json('cityList'); 下面我们对cityList的数据进行渲染 Uni-App 城市控件 1、选择pages目录,右击新建页面,记得勾选自动在pages.json中注册,否则需要手动去配置它..." } } 同时,pages目录下会多一个目录city,我们的城市选择页面就写到city/city.vue页面。...4、事件处理 (1)选择城市列表事件 choose (item) { // 选择城市后,将城市名字,adcode,经纬度缓存给vuex this.

    5.8K30

    弹出式模态窗体选择文本控件

    2006年就要到来了,最近比较忙,很少更新blog,今天发一个模态窗体选择文本控件辞旧迎新.新年在发几个asp.net2.0 webPart控件同各位分享: 经常使用摸态窗体,总是需要重复编写javascript...脚本.所以封装了这个控件,这个控件使用的是aspnet2.0的API.所以用在1.1上的需要自己修改代码. using System; using System.ComponentModel; using...using System.Web.UI.WebControls; namespace DotnetClubPortal.WebControls {     ///      /// 用户选择控件...this.txtObjectName.Text = value.ToString();             }         }         [Category("设置"),Description("选择页面路径..."btnSelect";             this.button.Attributes.Add("width","100");             this.button.Text = "选择

    89770

    android自定义控件之文件选择

    列举当前目录下的所有文件,如果是选择目录,则不显示文件,如果是选择文件,则需要显示文件。 ? 新建目录,就是在当前路径下新建目录,同时新建后的目录要能够及时显示在文件列表中。...实现的功能 文件选择 目录选择 可显示隐藏文件 显示上一次打开目录 显示上一级目录 显示当前路径 文件显示大小和修改时间 目录显示子项数量和修改日期 新建目录 难点和细节 1. android6.0以上版本动态权限请求...文件列采用RecyclerView DialogFragment与Dialog有一些不同的地方,其中show方法需要传入FragmentManager 另外需在onCreateVie方法初始化布局,以及获取到控件...文件选择 文件选择,可以通过当前路径路径以及列表索引来唯一确定路径;都是,当跳转目录后,索引应该重置。...这里采用WeakReference记录选择控件,但选择其他目录或者文件时,之前的控件需要重置一下状态。

    97020
    领券