1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798 |
- <template>
- <view class="container clearfix" >
- <view class="banner">
- <image :class="'banner-img'+index" :src="item" mode="" v-for="(item,index) in image1" :key="index"></image>
- </view>
- <!-- 侧边 -->
- <scroll-top :isScrollTop="isScrollTop" :bottom="300"></scroll-top>
- </view>
- </template>
- <script>
- import { mapState,mapMutations} from 'vuex';
-
- export default{
- data(){
- return{
- isIphoneX:this.$store.state.isIphoneX,
- isBannerHome:true,
- isBannerOems:false,
- image1:[
- 'https://static.caimei365.com/www/ppzs/1.jpg',
- ],
- isScrollTop:false
- }
- },
- onLoad(option) {
-
- },
- methods:{
-
- },
- onPageScroll(e){//实时获取到滚动的值
- if(e.scrollTop>400){
- this.isScrollTop = true
- }else{
- this.isScrollTop = false
- }
- },
- onShow() {
-
- }
- }
- </script>
- <style lang="scss">
- page{
- background-color: #FFFFFF;
- }
- .container{
- width: 100%;
- height: auto;
- .container-btn{
- width: 100%;
- box-sizing: border-box;
- padding: 7rpx 24rpx;
- background-color: #FFFFFF;
- position: fixed;
- display: flex;
- bottom: 0;
- left: 0;
- z-index: 999;
- .btn{
- flex: 1;
- background-image: linear-gradient(270deg, #1045e1 0%, #2bb4ff 100%);
- line-height: 84rpx;
- border-radius: 42rpx;
- text-align: center;
- font-size: 26rpx;
- color: #FFFFFF;
- padding: 13rpx;
- box-sizing:border-box;
- margin: 0 10rpx;
- .btn-text{
- width: 100%;
- height: 29rpx;
- float: left;
- line-height: 29rpx;
- font-size: $font-size-24;
- color: #FFFFFF;
- text-align: center;
- &.small{
- font-size: 18rpx;
- }
- }
- }
- }
- .banner{
- width: 100%;
- height: auto;
- float: left;
- .banner-img0{
- width: 100%;
- height: 2531rpx;
- display: block;
- }
- }
- }
- </style>
|