RN的轮播图组件

自行安装

js 复制代码
yarn add react-native-swiper

示例代码

js 复制代码
import React, {useRef, useEffect} from 'react';
import {View, Text} from 'react-native';
import Swiper from 'react-native-swiper';

const MySwiper = () => {

  return (
    <Swiper autoplay={true}>
      {/* 设置 autoplay 为 false,关闭自动播放 */}
      <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
        <Text>Slide 1</Text>
      </View>
      <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
        <Text>Slide 2</Text>
      </View>
      <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
        <Text>Slide 3</Text>
      </View>
    </Swiper>
  );
};

export default MySwiper;

效果图

相关推荐
GIS之路4 分钟前
GDAL 实现创建几何对象
前端
liulilittle18 分钟前
CLANG 交叉编译
linux·服务器·开发语言·前端·c++
自信阿杜33 分钟前
跨标签页数据同步完全指南:如何选择最优通信方案
前端·javascript
牛马11143 分钟前
WidgetsFlutterBinding.ensureInitialized()在 Flutter Web 端启动流程的影响
java·前端·flutter
Captaincc44 分钟前
2025: The year in LLMs
前端·vibecoding
指尖跳动的光1 小时前
Vue的nextTick()方法
前端·javascript·vue.js
码事漫谈1 小时前
可能,AI早都觉醒了
前端
qq_406176142 小时前
JS 事件循环(Event Loop)
开发语言·前端·javascript
Codebee2 小时前
ooder A2UI ES6版本正式发布:现代化模块架构,MIT开源许可
前端
Devin_chen2 小时前
4.前端使用Node + MongoDB + Langchain消息管理与聊天历史存储
前端·langchain