<template>
	<view>
		  <view class="shadow guodu" :class="opacity?'heig':''"  ></view>
	</view>
</template>

<script>
	export default {
		 props: {
		    opacity: {
		      type: Boolean,
		      default: false, // 初始不显示阴影
		    }
		  },
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="less">
.shadow {
  width: 100%;
  height: 0;
  position: absolute;
  left: 0;
  bottom: 0vw;
  border-radius: 50%;
  filter: blur(15rpx);
  background: linear-gradient(to top, RGBA(239, 240, 244, 1), RGBA(239, 240, 244, .1)); /* 根据需要调整 */
}
.guodu{
	transition: .4s;
	-webkit-transform-style: preserve-3d;
	-webkit-overflow-scrolling: touch;
}
.heig{
	height: 16vw !important;
}
</style>