Swiper current设置后不更新问题
-
Swiper设置current后在H5端值不更新是哪的问题?```
code_textimport Taro, { Component } from '@tarojs/taro' import { View, Swiper, SwiperItem, Image } from '@tarojs/components' // import { connect } from '@tarojs/redux' import { AtSegmentedControl } from 'taro-ui' import './dbanner.scss' class Banner extends Component { state = { current : 0, list: [{ "backgroundColor": "2a2217", "img": "https://yanxuan.nosdn.127.net/ec57acdb11e9c65d361267195f2b2de8.jpg", "rank": 1, "type": 3, "content": "/pages/webview/index?url=https%3A%2F%2Fyou.163.com%2Ftopic%2Fv1%2Fpub%2FKAmXjEWWmhTl.html" }, { "backgroundColor": "002a42", "img": "https://yanxuan.nosdn.127.net/1bcda063c3de758c49f9b3129d75c58e.jpg", "rank": 2, "type": 3, "content": "/pages/webview/index?url=https%3A%2F%2Fact.you.163.com%2Fact%2Fpub%2F2y1GHJEwSE7M.html" }, { "backgroundColor": "a32425", "img": "https://yanxuan.nosdn.127.net/af3c24e60b04bf506544dd98fd3cb453.jpg", "rank": 3, "type": 3, "content": "/pages/webview/index?url=https%3A%2F%2Fact.you.163.com%2Fact%2Fpub%2F80UiMHb8W7Ub.html" }, { "backgroundColor": "c74750", "img": "https://yanxuan.nosdn.127.net/cea3a93f42cddf55e8511caaf4eba799.jpg", "rank": 4, "type": 3, "content": "/pages/webview/index?url=https%3A%2F%2Fact.you.163.com%2Fact%2Fpub%2FDisKHkXqufXpABy.html" }] } config = { navigationBarTitleText: '详情' } handleClick (value) { this.setState({ current: value }) } render () { const { current } = this.state; return ( <View className='home-banner'> <Swiper className='home-banner__swiper' current={current} > {this.state.list.map(item => ( <SwiperItem key={item.rank} className='home-banner__swiper-item' > <Image className='home-banner__swiper-item-img' src={item.img} /> </SwiperItem> ))} </Swiper> <View className='swiper-label'> {current}/{this.state.list.length} </View> </View> ) } } export default Banner
-
import Taro, { Component } from '@tarojs/taro' import { View, Swiper, SwiperItem, Image } from '@tarojs/components' // import { connect } from '@tarojs/redux' import { AtSegmentedControl } from 'taro-ui' import './dbanner.scss' class Banner extends Component { state = { current : 0, list: [{ "backgroundColor": "2a2217", "img": "https://yanxuan.nosdn.127.net/ec57acdb11e9c65d361267195f2b2de8.jpg", "rank": 1, "type": 3, "content": "/pages/webview/index?url=https%3A%2F%2Fyou.163.com%2Ftopic%2Fv1%2Fpub%2FKAmXjEWWmhTl.html" }, { "backgroundColor": "002a42", "img": "https://yanxuan.nosdn.127.net/1bcda063c3de758c49f9b3129d75c58e.jpg", "rank": 2, "type": 3, "content": "/pages/webview/index?url=https%3A%2F%2Fact.you.163.com%2Fact%2Fpub%2F2y1GHJEwSE7M.html" }, { "backgroundColor": "a32425", "img": "https://yanxuan.nosdn.127.net/af3c24e60b04bf506544dd98fd3cb453.jpg", "rank": 3, "type": 3, "content": "/pages/webview/index?url=https%3A%2F%2Fact.you.163.com%2Fact%2Fpub%2F80UiMHb8W7Ub.html" }, { "backgroundColor": "c74750", "img": "https://yanxuan.nosdn.127.net/cea3a93f42cddf55e8511caaf4eba799.jpg", "rank": 4, "type": 3, "content": "/pages/webview/index?url=https%3A%2F%2Fact.you.163.com%2Fact%2Fpub%2FDisKHkXqufXpABy.html" }] } config = { navigationBarTitleText: '详情' } handleClick = (value) => { console.log('v:', value) this.setState({ current: value }) } // 更新当前帧 onChange = (e) => { this.setState({ current: e.detail.current }) console.log(e) } render () { const { current } = this.state; return ( <View className='home-banner'> <Swiper className='home-banner__swiper' current={current} onChange = {this.onChange} > {this.state.list.map(item => ( <SwiperItem key={item.rank} className='home-banner__swiper-item' > <Image className='home-banner__swiper-item-img' src={item.img} /> </SwiperItem> ))} </Swiper> <View className='swiper-label'> {current}/{this.state.list.length} </View> <Button onClick={this.handleClick.bind(this, 2)}>设置为第 3 帧</Button> </View> ) } } export default Banner
-
@Taro-小助手-honly H5端获取不到Source的值,会出去点击时,Swiper不会跟着变
-
@dcx 描述细一些咯,你这个描述不太好复现或者分析