Ant-design-mobile: Carousel 延迟出现，基本三秒后才会出现

Created on 30 Dec 2016 · 7Comments · Source: ant-design/ant-design-mobile

本地环境

antd-mobile 版本：
"antd-mobile": "^0.9.12",
"babel-plugin-import": "^1.1.0",
"css": "^2.2.1",
"dva": "^1.1.0",
"postcss-pxtorem": "^3.3.1",
"react": "^15.3.2",
"react-dom": "^15.3.2"
浏览器 (或标明是 react-native) 及其版本：
运行环境及其版本：

你做了什么？

你期待的结果是：

轮播图区域正常出现，未有延迟现象发生

实际上的结果：

轮播图在进入页面的三秒后才出现

可重现的在线演示

Source

liangyan1992

All 7 comments

不理解你的描述。这个期待的结果截图是什么意思。

warmhug on 30 Dec 2016

👍1

最好是贴一下你的实例代码，这样方便排查定位问题

silentcloud on 30 Dec 2016

👍1

使用中也发现有这中情况大概原因：使用异步取数据 Carousel组件初始化时接口数据还未返回，此时Carousel视图高度很小，3秒滚动到时才重新获取高度显示正常有可能是Carouse里面没有监听data

判断data有数据时才 render Carousel
或用 https://oliviertassinari.github.io/react-swipeable-views/

snow798 on 31 Dec 2016

👍1

Carousel组件里如果各个 item 是图片，要预先知道图片的高度，并设定在组件上。如果是等待数据加载，建议加载完数据再渲染 Carousel 组件，写法如：this.state.data.length ? <Carousel ...> : null

warmhug on 2 Jan 2017

👍1

异步数据的话最好是用一个 loading 的东西占位

silentcloud on 3 Jan 2017

👍1

谢谢大家问题已经解决第一次在github提问，学到很多：）

liangyan1992 on 3 Jan 2017

This thread has been automatically locked because it has not had recent activity. Please open a new issue for related bugs and link to relevant comments in this thread.