提交 0bf5470b 编写于 作者: 雪洛's avatar 雪洛

feat: web端开启long-list示例,调整swiper-list示例

上级 4c4af673
此差异已折叠。
......@@ -54,8 +54,7 @@
export default {
data() {
return {
list: [
// #ifdef APP
list: [
{
id: 'long-list',
url: 'long-list',
......@@ -72,8 +71,7 @@
url: 'long-list2'
},
] as Page[],
},
// #endif
},
{
id: 'list-news',
url: 'list-news',
......
......@@ -7,7 +7,7 @@
<view class="swiper-list">
<scroll-view ref="tabScroll" class="swiper-tabs" direction="horizontal" :show-scrollbar="false">
<view class="flex-row" style="align-self: flex-start;">
<text ref="swipertab" class="swiper-tabs-item" :class="swiperIndex==index ? 'swiper-tabs-item-active' : ''"
<text ref="swipertab" space="nbsp" class="swiper-tabs-item" :class="swiperIndex==index ? 'swiper-tabs-item-active' : ''"
v-for="(item, index) in swiperList" :key="index" @click="onTabClick(index)">
{{item.name}}
</text>
......@@ -209,7 +209,7 @@
// 滚动到水平中心位置
const scroll_x = x - this.swiperWidth / 2
if(this.tabScrollView !== null){
if(this.tabScrollView != null){
this.tabScrollView!.scrollLeft = scroll_x
}
},
......@@ -238,6 +238,9 @@
.swiper-list {
height: 100%;
/* #ifdef WEB */
flex: 1;
/* #endif */
}
.swiper-tabs {
......@@ -249,6 +252,7 @@
color: #555;
font-size: 16px;
padding: 12px 25px;
white-space: nowrap;
}
.swiper-tabs-item-active {
......
......@@ -165,7 +165,9 @@
const percentage = Math.abs(current_offset_x) / this.swiperWidth
// 通知更新指示线
this.updateTabIndicator(current_index, move_to_index, percentage)
if (current_index != move_to_index) {
this.updateTabIndicator(current_index, move_to_index, percentage)
}
// 首次可见时初始化数据
this.initSwiperItemData(move_to_index)
......@@ -242,6 +244,9 @@
.swiper-list {
height: 100%;
/* #ifdef WEB */
flex: 1;
/* #endif */
}
.swiper-tabs {
......@@ -253,6 +258,7 @@
color: #555;
font-size: 16px;
padding: 12px 25px;
white-space: nowrap;
}
.swiper-tabs-item-active {
......
......@@ -191,6 +191,7 @@
color: #555;
font-size: 16px;
padding: 12px 25px;
white-space: nowrap;
}
.swiper-tabs-item-active {
......
......@@ -143,6 +143,7 @@
color: #555;
font-size: 16px;
margin: 15px 25px 5px 25px;
white-space: nowrap;
}
.swiper-tabs-item-active {
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册