Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

taro 的swiper组件怎么能做到这样的一行显示2.5个item这种,并且兼容h5,看API上没有next-margin这个属性小程序是可以的但是h5没有找到办法改了样式还不行 #4595

Closed
luodanyalian opened this issue Oct 14, 2019 · 6 comments
Assignees

Comments

@luodanyalian
Copy link

luodanyalian commented Oct 14, 2019

问题描述
taro 的swiper组件怎么能做到这样的一行显示2.5个item这种?并且兼容h5,看API上没有next-margin这个属性小程序是可以的但是h5没有找到办法改了样式还不行

复现步骤
image

//代码
<Swiper
            className='swiper'
            circular
            displayMultipleItems={2.5}
            onChange={this.onSwiperChange.bind(this)}
          >
            <SwiperItem className='swiper_item'>
              <View className='item'>
                <Image
                  className='image'
                  src={require('../../../static/images/1.jpg')}
                />
                <View className='title'>作品正面</View>
              </View>
            </SwiperItem>
</Swiper>

期望行为
希望可以支持

系统信息
Taro CLI 1.3.19 environment info:
System:
OS: macOS 10.14
Shell: 5.3 - /bin/zsh
Binaries:
Node: 10.16.3 - ~/.nvm/versions/node/v10.16.3/bin/node
Yarn: 1.12.3 - /usr/local/bin/yarn
npm: 6.11.3 - ~/.nvm/versions/node/v10.16.3/bin/npm

补充信息
我设置了displayMultipleItems={2.5}这个样式没有了问题,但是切换的时候出现了一直循环的问题,设置了不能循环播放的前提下。

@taro-bot
Copy link

taro-bot bot commented Oct 14, 2019

欢迎提交 Issue~

如果你提交的是 bug 报告,请务必遵循 Issue 模板的规范,尽量用简洁的语言描述你的问题,最好能提供一个稳定简单的复现。🙏🙏🙏

如果你的信息提供过于模糊或不足,或者已经其他 issue 已经存在相关内容,你的 issue 有可能会被关闭。

Good luck and happy coding~

@taro-bot
Copy link

taro-bot bot commented Oct 14, 2019

CC @jinjinjin0731

@jinjinjin0731
Copy link
Contributor

切换的时候出现了一直循环的问题,设置了不能循环播放的前提下。

这指的是? 能否有代码片段看下

@luodanyalian
Copy link
Author

切换的时候出现了一直循环的问题,设置了不能循环播放的前提下。

这指的是? 能否有代码片段看下

<Swiper
      className='swiper'
      circular
       displayMultipleItems={2.5}
       onChange={this.onSwiperChange.bind(this)}
>
            <SwiperItem className='swiper_item'>
              <View className='item'>
                <Image
                  className='image'
                  src={require('../../../static/images/1.jpg')}
                />
                <View className='title'>作品正面</View>
              </View>
            </SwiperItem>
           <SwiperItem className='swiper_item'>
              <View className='item'>
                <Image
                  className='image'
                  src={require('../../../static/images/1.jpg')}
                />
                <View className='title'>作品正面</View>
              </View>
            </SwiperItem>
            <SwiperItem className='swiper_item'>
              <View className='item'>
                <Image
                  className='image'
                  src={require('../../../static/images/1.jpg')}
                />
                <View className='title'>作品正面</View>
              </View>
            </SwiperItem>
</Swiper>

@jinjinjin0731
Copy link
Contributor

jinjinjin0731 commented Oct 20, 2019

你的数据是动态的还是静态的? @luodanyalian

@ZakaryCode
Copy link
Contributor

same as #1392

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants