<template> <view class="bottom-wrap" :class="{'bottom-wrap-static':static}" :style="[{customStyle,'color': color || 'rgba(255, 255, 255, 1)'}]"> <view v-if="!$slots.content" class="bottom" :style="[customStyle]"> <view class="bottom-p">copyright © 2021 智慧停车</view> </view> <slot name="content" v-else /> </view> </template> <script> export default { name:'u-bottom', props:{ customStyle:{ type: Object, default() { return {}; } }, static:{ type: Boolean, default: false }, color:{ type: String, default: '' } }, } </script> <style lang="scss" > .bottom-wrap{ text-align: center; height: 200rpx; .bottom{ position: fixed; left: 0; right: 0; bottom: 76rpx; font-size: 26rpx; line-height: 33rpx; .bottom-p + .bottom-p{ margin-top: 10rpx; } } &-static{ .bottom{ position: static; } } } </style>