uniapp时间选择器
2024-01-09 11:46:15
Uniapp 是一套基于Vue.js 开发的跨平台开发框架,它能够以一套代码编译成多个平台的应用,包括 iOS、Android、H5 等。要实现时间选择器可以使用uni-app提供的组件picker,它可以用于选择器、时间选择器、日期选择器等场景。
以下是一个简单的时间选择器实现示例:
在页面上添加 picker 组件
?
<template>
<view>
<picker mode="time" @change="onChange"></picker>
<p>当前时间:{{time}}</p>
</view>
</template>
<script>
export default {
data() {
return {
time: ''
}
},
methods: {
onChange(event) {
this.time = event.detail.value
}
}
}
</script>
-
在组件中监听 picker 的 change 事件,将选择的时间赋值给 data 中的 time 变量。
-
在组件中使用 {{time}} 显示选择的时间。
注意:需要在 manifest.json 中添加需要使用的组件:
"usingComponents": {
"picker": "@vant/weapp/picker/index"
}
这里使用了 Vant UI 组件库的 picker 组件,当然你也可以使用其他组件库或自己写组件。
文章来源:https://blog.csdn.net/m0_71966801/article/details/135418482
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符,请联系我的编程经验分享网邮箱:veading@qq.com进行投诉反馈,一经查实,立即删除!
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符,请联系我的编程经验分享网邮箱:veading@qq.com进行投诉反馈,一经查实,立即删除!