1:将时间插件-timePicker导入到
开发工具HBuilderX
2:导入之后可以看到在我的项目底下多出了一个组件components文件夹
3:根据文档示例:
https://ext.dcloud.net.cn/plugin?id=700
来写页面代码
代码如下:
<template> <view class="content"> <hTimePicker sTime="15" cTime="15" interval="1" @changeTime="changeTime"> <view slot="pCon" class="changeTime"> 点击选择时间 </view> </hTimePicker> </view> </template> <script> import hTimePicker from "@/components/h-timePicker/h-timePicker.vue"; export default { components: { hTimePicker }, data() { return { title: 'Hello' }; }, onLoad() {}, methods: {} }; </script> <style> .content { text-align: center; height: 400upx; margin-top: 200upx; } </style>
效果如下,点击按钮,底部弹出时间选择框