1:将时间插件-timePicker导入到 开发工具HBuilderX
2:导入之后可以看到在我的项目底下多出了一个组件components文件夹
3:根据文档示例: https://ext.dcloud.net.cn/plugin?id=700 来写页面代码
代码如下:
代码语言:javascript复制<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>
效果如下,点击按钮,底部弹出时间选择框