uni-app使用picker底部弹起的滚动选择器（日期选择器）

picker从底部弹起的滚动选择器，现支持五种选择器，通过mode来区分，分别是普通选择器，多列选择器，时间选择器，日期选择器，省市区选择器，默认是普通选择器。

html部分：
<view class="">日期选择器</view><view class=""><view class=""><view class="">当前选择</view><view class=""><picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange"><view class="">{{date}}</view></picker></view></view></view>

script部分：
<script>export default {data() {const currentDate = this.getDate({format: true})return {date: currentDate,time: '12:01'}},methods: {bindDateChange: function(e) {this.date = e.target.value},getDate(type) {const date = new Date();let year = date.getFullYear();let month = date.getMonth() + 1;let day = date.getDate();if (type === 'start') {year = year - 60;} else if (type === 'end') {year = year + 2;}month = month > 9 ? month : '0' + month;;day = day > 9 ? day : '0' + day;return `${year}-${month}-${day}`;}}}
</script>

详细picker属性介绍，官方地址链接：https://uniapp.dcloud.io/component/picker

uni-app使用picker底部弹起的滚动选择器（日期选择器）相关推荐

自已开发完美的触摸屏网页版仿app弹窗型滚动列表选择器/日期选择器
手机端网页版app在使用下拉列表时,传统的下拉列表使用起来体验非常不好,一般做的稍好一点的交互功能界面都不会直接使用下拉列表,所以app的原生下拉列表都是弹窗列表选择,网页型app从使用体验上来当然也 ...
微信小程序之滚动选择器(时间日期选择器)
微信小程序自己封装了很多控件,用起来确实很方便,如果这是Android里面,还需要自己去定义,不废话,效果图: 一起来看看怎么实现的呢?看完你应该就该说,尼玛,这就行啦-. 这个效果呢,要用到pick ...
切换 uniapp_万能前端框架uni app初探03：底部导航开发
前言本节我们使用uni app的底部导航功能,点击不同tab会显示不同页面,这个功能在实际项目开发中几乎是必备的. 一.基础知识 1.tabBar 如果应用是一个多 tab 应用,可以通过 tabB ...
Android uni app 列表底部白条解决方案
uni app中android打开本地vue的列表会发现,底部有条白边. vue通过uni.getSystemInfoSync();方法获取系统信息,首次取值对,再次取值就出错 uni app每次启动 ...
uni app map 地图漂浮问题及方案
uni app map 地图漂浮问题及方案文章页有图片导致的问题,图片没加载出来,导致文章内容高度不固定,如果图片没加载出来,高度就是0,如果此时开始加载map,那么map就在那里加载,map原生 ...
uni app(H5)中软键盘弹出,固定定位绝对定位元素位置发生错乱
一.问题如下最近用uni app写项目,发现H5软键盘弹起,导致我固定定位的按钮被顶了上去,如图二.解决方法 1.让其在输入框获取焦点时隐藏百度了许多,有让输入框获取焦点时让按钮隐藏的方法,失去 ...
android滚动广告图片素材,安卓手机宣传视频制作软件如何在视频底部添加一行滚动的广告语？视频加滚动水印...
窝是帮助用户解决问题提供教程解决方案在这个过程中有我们.... 『安卓手机端教程方案』上周,小编介绍了手机视频片尾滚动字幕制作的方法,今天要介绍的是在视频底部加一行滚动水印的方法,适合到不限于制作 ...
vant 验证手机号_【uni app】vant weapp的引入和部分详细调用（表单输入框、验证码、弹出层搭配选择器、地图）...
本次小程序的开发使用uni app+vant weapp,vant weapp如何引用和部分组件使用方法如下引入在github(https://github.com/youzan/vant-wea ...
uni.app H5(微信公众号定位) uni.getLocation
最近在开发公众号,由于之前经常使用uni,app写APP,索性就用uni.app来开发公众号了, 不过也遇到了一个问题,就是在公众号的首页要获取用户的定位.我看了看官网的API 有个uni.getLo ...

uni-app使用picker底部弹起的滚动选择器（日期选择器）

picker从底部弹起的滚动选择器，现支持五种选择器，通过mode来区分，分别是普通选择器，多列选择器，时间选择器，日期选择器，省市区选择器，默认是普通选择器。

详细picker属性介绍，官方地址链接：https://uniapp.dcloud.io/component/picker

uni-app使用picker底部弹起的滚动选择器（日期选择器）相关推荐

最新文章

热门文章