最近使用react引用了三方UI antd-mobile 和一些插件督勺，在使用過(guò)程中遇到了一些問(wèn)題洛搀，實(shí)際解決后寫(xiě)點(diǎn)心得，小記下译打，避免再次入坑耗拓。
- antd-mobile 中用到了最常見(jiàn)的
Carousel組件：
組件屬性如下：
- 引用demo加載寫(xiě)死的數(shù)據(jù)一點(diǎn)問(wèn)題沒(méi)有，但是當(dāng)fetch 加載動(dòng)態(tài)數(shù)據(jù)的時(shí)候奏司，確不輪播了乔询。找百度大娘吧，找了一圈沒(méi)有答案结澄，自己研究，問(wèn)題很明確了肯定是異步數(shù)據(jù)的問(wèn)題岸夯，Carousel拿到的是自己的子元素麻献，所以必須在數(shù)據(jù)加載以后再輪播，走了個(gè)彎路猜扮。
- 在state里初始化了一個(gè)flag 為false 勉吻，在componentDidMount 里數(shù)據(jù)請(qǐng)求回來(lái)以后把flag改為true，最后一步旅赢，把Carousel 的API中autoplay 改為可控制的輪播齿桃，想什么時(shí)候輪播就什么時(shí)候輪播，讓autoplay = {this.state.flag},完美解決煮盼。
- 引用swiper :
- swiper 可配置性強(qiáng)短纵，同樣遇到了上述問(wèn)題，異步數(shù)據(jù)不輪播僵控。即使在componentDidMount中初始化也不輪播香到，很郁悶，怎么回事哪，首先我升級(jí)了swiper悠就，引用最新版本4.x.x, 擼完api發(fā)現(xiàn)千绪，動(dòng)態(tài)加載需要添加觀察者，就是這兩個(gè)鬼
observer:true, observeParents:true,梗脾，于是很開(kāi)心的加上了荸型，然而....沒(méi)有什么卵用。真的是炸茧。瑞妇。。宇立。踪宠。
沒(méi)辦法，再細(xì)看api妈嘹，柳暗花明又一api傲痢！于是润脸，我在初始化的的時(shí)候把 init這個(gè)api設(shè)置為false,然后再在componentDidmount中調(diào)用swiper.init(),神奇的一幕發(fā)生了柬脸。居然自己跑起來(lái)了。
廢話不多少毙驯，貼上代碼：
image.png
