SwiperItem

仅可放置在 swiper 组件中，宽高自动设置为100%

参考文档

类型

ComponentType<SwiperItemProps>

示例代码

React

class App extends Component {

render () {

return (

<Swiper

className='test-h'

indicatorColor='#999'

indicatorActiveColor='#333'

vertical

circular

indicatorDots

autoplay>

<SwiperItem>

<View className='demo-text-1'>1</View>

</SwiperItem>

<SwiperItem>

<View className='demo-text-2'>2</View>

</SwiperItem>

<SwiperItem>

<View className='demo-text-3'>3</View>

</SwiperItem>

</Swiper>

)

}

}

Vue

<template>

<swiper

class='test-h'

indicator-color='#999'

indicator-active-color='#333'

:vertical="true"

:circular="true"

:indicator-dots="true"

:autoplay="true"

>

<swiper-item>

<view class='demo-text-1'>1</view>

</swiper-item>

<swiper-item>

<view class='demo-text-2'>2</view>

</swiper-item>

<swiper-item>

<view class='demo-text-3'>3</view>

</swiper-item>

</swiper>

</template>

SwiperItemProps

参数	类型	必填	说明
itemId	string	否	该 swiper-item 的标识符

API 支持度

API	微信小程序	百度小程序	支付宝小程序	字节跳动小程序	H5	React Native
SwiperItemProps.itemId	✔️	✔️	✔️	✔️	✔️	✔️

注意

• 不要为 SwiperItem 设置 style 属性，可以通过 class 设置样式。7147