封装自己的底部弹出框
前言
自己工作的时候接受的一个项目因为app壳子版本登记太低也是为了防止出现兼容问题，所有的组件都是自己封装的，这个项目是基于Uniapp开发的App和H5.我接手的业务中涉及到的组件很多，今天就自己封装一个底部弹出框，因为我这个弹出框是弹出内容在里面做选择，所以原来封装的都不好用不适合所以自己开发的。
代码部分
这是一个弹出框里面有很多的内容
<template>
<view @click='open'>点击打开</view>
<view class="poupbox" :style="{transform: status ? 'translateY(0)' : 'translateY(100%)'}">这里写你自己想写的内容
</view>
<template>
export default {data() {return {status:false}},onLoad() {},methods: {open(){this.status=!status;} }}</script>
<style>.poupbox{background-color: #FFFFFF;border-top: 1px solid #CCCCCC;border-radius: 8px;position: fixed;left: 0;right: 0;bottom: 0;z-index: 10;transition: all .3s;}</style>
结语
这就是最简单一个弹出框，可以基于这个弹出框去写时间选择的弹窗、日期选择的下拉框，把自己需求写到自己代码的内容区就可以了。