Hooke / meihua-island-book

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
888a8cd0 1 parent 7e3eeafa

fix

Inline Side-by-side
Showing 2 changed files with 33 additions and 23 deletions
.index-page {
.index-cover {
position: relative;
.cover-arrow {
position: absolute;
right: 0;
left: calc(50% - 30rpx);
bottom: 1%;
}
}
.index-title {
text-align: center;
font-weight: bold;
font-size: 1.25rem;
padding: 1rem 0 0.25rem;
background-color: #f9f9f9;
}
.index-list {
background-color: #f9f9f9; overflow: auto;
}
}
.slide-box {
height: 15rem;
.slide-image {
width: 100%;
height: 100%;
width: 100%;
height: 100%;
}
}
.bg-gradient {
background: linear-gradient(#B3DDC9, #B3DDC9) no-repeat;
background: linear-gradient(#b3ddc9, #b3ddc9) no-repeat;
/*调整下划线的宽度占百分之百 高度是3px */
background-size: 100% 1vw;
/* 调整下划线的起始位置 左侧是0 上边是1.15em */
......@@ -25,7 +46,7 @@
left: 0;
width: 100%;
height: 1.1rem;
border-bottom: 4rpx solid #B3DDC9;
border-bottom: 4rpx solid #b3ddc9;
}
}
......
<!--
* @Date: 2022-09-19 14:11:06
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2023-12-19 14:35:59
* @LastEditTime: 2023-12-20 10:44:15
* @FilePath: /meihuaApp/src/pages/index/index.vue
* @Description: 首页
-->
<template>
<view>
<view class="index-page">
<scroll-view :style="scrollStyle" :scroll-y="true" :scroll-top="scrollTop" :scroll-with-animation="true" @scroll="onScroll" @scrolltoupper="onScrollToUpper" @scrolltolower="onScrollToLower">
<view style="position: relative;">
<view class="index-cover">
<image :style="coverStyle" mode="aspectFill" src="https://cdn.ipadbiz.cn/meihua/banner1@2x.png" />
<!-- <div class="arrow-down" @tap="onArrowDown">
<image style="width: 2rem; height: 2rem;" :src="arrowDownImg"/>
</div> -->
<view @tap="onArrowDown" style="position: absolute; right: 0; left: calc(50% - 30rpx); bottom: 1%;">
<view @tap="onArrowDown" class="cover-arrow">
<IconFont color="#f9f9f9" size="30" name="joy-smile" class="nut-icon-am-jump nut-icon-am-infinite"></IconFont>
</view>
</view>
<view style="text-align: center; font-weight: bold; font-size: 1.25rem; padding: 1rem 0 0.25rem; background-color: #f9f9f9;">热门推荐</view>
<view style="background-color: #f9f9f9; overflow: auto;">
<room-card v-for="(item, index) in 5" :key="index"></room-card>
<view class="index-title">热门推荐</view>
<view class="index-list">
<room-card v-for="(item, index) in 5" :key="index" />
</view>
</scroll-view>
<view style="height: 6rem;"></view>
......@@ -32,11 +29,8 @@ import Taro from '@tarojs/taro'
import { IconFont } from '@nutui/icons-vue-taro';
import { ref } from 'vue';
import roomCard from '@/components/roomCard.vue'
import arrowDownImg from '@/assets/images/arrow-down.png'
// import icon_no_join_recommend from '@/images/icon/no-tuijian@2x.png'
// import icon_banner from '@/images/icon/banner@2x.png'
// import arrowDownImg from '@/assets/images/arrow-down.png'
import navBar from '@/components/navBar.vue'
// import { useDidShow } from '@/hooks/life'
import { useDidShow } from '@tarojs/taro'
// TAG: 模拟onShow事件
useDidShow(() => {
......@@ -142,11 +136,6 @@ export default {
this.scrollTop = 0; // 重置scrollTop，让按钮能再往下滚动
},
onScrollToLower () {
// if(!this.flag){
// return
// }
// this.flag = false;
// this.getList();
console.warn('onScrollToLower');
},
async onArrowDown () {
......