提交 40eb8f02 编写于 作者: H hdx

swiper-list2: 移除$开头的变量,支持 web

上级 2cfbdb0f
...@@ -39,10 +39,10 @@ ...@@ -39,10 +39,10 @@
data() { data() {
return { return {
swiperList: [] as SwiperViewItem[], swiperList: [] as SwiperViewItem[],
swiperIndex: -1, swiperIndex: 0,
$tabScrollView: null as null | UniElement, tabScrollView: null as null | UniElement,
$animationFinishIndex: 0, animationFinishIndex: 0,
$swiperWidth: 0 swiperWidth: 0
} }
}, },
onLoad() { onLoad() {
...@@ -53,9 +53,9 @@ ...@@ -53,9 +53,9 @@
} }
}, },
onReady() { onReady() {
this.$tabScrollView = this.$refs['tabScroll'] as UniElement this.tabScrollView = this.$refs['tabScroll'] as UniElement
this.$swiperWidth = (this.$refs["swiper"] as UniElement).getBoundingClientRect().width this.swiperWidth = (this.$refs["swiper"] as UniElement).getBoundingClientRect().width
this.setSwiperIndex(0, true) this.updateTabIndicator(this.swiperIndex, this.swiperIndex, 1)
}, },
methods: { methods: {
onTabClick(index : number) { onTabClick(index : number) {
...@@ -65,9 +65,9 @@ ...@@ -65,9 +65,9 @@
const offset_x = e.detail.dx const offset_x = e.detail.dx
// 计算当前索引并重置差异 // 计算当前索引并重置差异
const current_offset_x = offset_x % this.$swiperWidth const current_offset_x = offset_x % this.swiperWidth
const current_offset_i = offset_x / this.$swiperWidth const current_offset_i = offset_x / this.swiperWidth
const current_index = this.$animationFinishIndex + Math.floor(current_offset_i) const current_index = this.animationFinishIndex + parseInt(current_offset_i + '')
// 计算目标索引及边界检查 // 计算目标索引及边界检查
let move_to_index = current_index let move_to_index = current_index
...@@ -78,14 +78,14 @@ ...@@ -78,14 +78,14 @@
} }
// 计算偏移百分比 // 计算偏移百分比
const percentage = Math.abs(current_offset_x) / this.$swiperWidth const percentage = Math.abs(current_offset_x) / this.swiperWidth
// 通知更新指示线 // 通知更新指示线
this.updateTabIndicator(current_index, move_to_index, percentage) this.updateTabIndicator(current_index, move_to_index, percentage)
}, },
onSwiperAnimationfinish(e : SwiperAnimationFinishEvent) { onSwiperAnimationfinish(e : SwiperAnimationFinishEvent) {
this.setSwiperIndex(e.detail.current, true) this.setSwiperIndex(e.detail.current, true)
this.$animationFinishIndex = e.detail.current this.animationFinishIndex = e.detail.current
}, },
setSwiperIndex(index : number, updateIndicator : boolean) { setSwiperIndex(index : number, updateIndicator : boolean) {
if (this.swiperIndex == index) { if (this.swiperIndex == index) {
...@@ -99,8 +99,7 @@ ...@@ -99,8 +99,7 @@
} }
}, },
updateTabIndicator(current_index : number, move_to_index : number, percentage : number) { updateTabIndicator(current_index : number, move_to_index : number, percentage : number) {
// TODO 0.0 != 0 if (percentage == 0) {
if (percentage.toDouble() == 0.0) {
return return
} }
...@@ -122,10 +121,8 @@ ...@@ -122,10 +121,8 @@
// 滚动到水平中心位置 // 滚动到水平中心位置
const target_x = lerpNumber(current_node.offsetLeft, move_to_node.offsetLeft, percentage) const target_x = lerpNumber(current_node.offsetLeft, move_to_node.offsetLeft, percentage)
const center_x = target_x + move_to_node.offsetWidth / 2 - this.$swiperWidth / 2 const center_x = target_x + move_to_node.offsetWidth / 2 - this.swiperWidth / 2
if(this.$tabScrollView !== null){ this.tabScrollView!.scrollLeft = center_x
this.$tabScrollView!.scrollLeft = center_x
}
} }
} }
} }
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册