SEMI DESIGN 源码学习(六)轮播图

轮播图代码位于 packages/semi-ui/carousel/index.tsx,代码量不多。

核心同样是这个 foundation 属性,类型为 CarouselFoundation。

CarouselFoundation 封装了轮播图的操作方法,通过传入的 adapter,管理轮播图组件的 state。

adapter 目的是操作组件的 state 属性。

组件暴露的方法实际上调用的是 foundation 的方法。

renderChildren 方法渲染传给轮播图组件的子元素。

renderIndicator, renderArrow 分别渲染指示器和切换箭头。

最后 render 方法返回一个 div 容器,包裹整个组件。

本文完,下期详细解释这个 foundation 模式。

相关推荐
扶风ff5 小时前
新品知识更新太快?用练题簿在线刷题,安排企业培训的小测与复盘
前端·学习·小程序
对空六课6 小时前
支持注意力分析的热力图工具有哪些?
前端·数据库·数据分析
Csvn7 小时前
Vue3 响应式与编译:依赖收集如何升级为节点级靶向更新
前端
星栈8 小时前
pnpm 12 升级实测
前端·javascript
Sirens.8 小时前
Java并发锁详解:六类锁策略与 synchronized 底层原理
java·前端·算法
Ai-_Man8 小时前
您您这可以把Microsofat Copilot的多个会话比如说。左侧的多个会话一次性导出吗?不是单条会话里面的多次会对话。AI导出鸭
javascript·人工智能·ai·小程序·电脑·copilot
特创数字科技9 小时前
一个纯本地运行的图片处理工具:压缩 / 裁剪 / 九宫格 / 圆角 / 滤镜 / 拼图 / 水印,终生使用
前端
IT_陈寒10 小时前
Vue的v-if和v-for混用居然是个天坑
前端·人工智能·后端
天衍四九-10 小时前
【无标题】
前端·spring boot·mysql·nginx·docker
广州华水科技10 小时前
2026年单北斗GNSS变形监测系统推荐榜单,解锁GNSS位移监测新高度
前端