Skip to content

Commit

Permalink
fix(taro-components): 修复swiper 更新数据之后,容器宽高没有重置的问题, issue#296,
Browse files Browse the repository at this point in the history
  • Loading branch information
jinjinjin0731 committed Jul 11, 2018
1 parent 1a99375 commit 9f42d61
Showing 1 changed file with 36 additions and 29 deletions.
65 changes: 36 additions & 29 deletions packages/taro-components/src/components/swiper/swiper.js
Expand Up @@ -44,19 +44,53 @@ class Swiper extends Nerv.Component {
this.pauseAutoPlay = this.pauseAutoPlay.bind(this)
this.autoplay = this.autoplay.bind(this)
this.computedChangeContainer = this.computedChangeContainer.bind(this)
this.updateContainerBox = this.updateContainerBox.bind(this)
}

componentDidMount () {
this.updateContainerBox(this.props.children)

if (this.props.autoplay) this.autoplay(this.props.interval)
}

componentWillReceiveProps (nextProps) {
this.updateContainerBox(nextProps.children)
const { interval, autoplay, circular } = nextProps
this.pauseAutoPlay()
// this.updateCurrentIndex(current)
if (!circular) {
this.computedChangeContainer()
}
if (!autoplay) return

this.autoplay(interval)
}

componentWillUnmount () {
this.pauseAutoPlay()
}

// 在开关衔接滑动的时候,计算当前下标
computedChangeContainer () {
if (this.props.children.length - 1 === this.state.currentIndex) {
this.pauseAutoPlay()
return true
}
return false
}

// 更新容器的宽高
updateContainerBox (children) {
let $container = Nerv.findDOMNode(this.SwiperWp)
let childLen = children.length

// 默认偏移量
let offsetVal =
this.props.current <= this.props.children.length + 2
this.props.current <= children + 2
? !this.props.vertical
? $container.offsetWidth * -this.props.current
: $container.offsetHeight * -this.props.current
: 0
let childLen = this.props.children.length

// 是否衔接滑动
// if (this.props.circular) {
Expand All @@ -79,33 +113,6 @@ class Swiper extends Nerv.Component {
// 计算指定下标位置
translate: offsetVal
})

if (this.props.autoplay) this.autoplay(this.props.interval)
}

componentWillReceiveProps (nextProps) {
const { interval, autoplay, circular } = nextProps
this.pauseAutoPlay()
// this.updateCurrentIndex(current)
if (!circular) {
this.computedChangeContainer()
}
if (!autoplay) return

this.autoplay(interval)
}

componentWillUnmount () {
this.pauseAutoPlay()
}

// 在开关衔接滑动的时候,计算当前下标
computedChangeContainer () {
if (this.props.children.length - 1 === this.state.currentIndex) {
this.pauseAutoPlay()
return true
}
return false
}

// 更新下标
Expand Down

0 comments on commit 9f42d61

Please sign in to comment.