當better-scroll遇見了react擦出的火花


  關於better-scroll這個插件前面已經介紹過兩次了 從原生js使用到結合服務端發送數據使用都有過介紹

 

  今天給大家分享一下這款插件在react中遇見的坑  總之我真是對這款插件又愛又恨 每次各種bug十足后還不去拋棄他

繼續去研究他 真是恨之切,愛之深,典型的受虐狂啊  哈哈  好了廢話不多說接下來給大家展示在react遇見的小問題

 

  首先我想實現的是一個下拉刷新的小功能,那么我們就得需要數據 在最初始的react中實現我在state中定義了一個空數組

然后在componentDidMount這個生命周期第一次發送ajax請求用來給我的初始值渲染數據,然后請求過來十條數據后發送給了

列表組件渲染上了整個頁面,接着我在這個ajax的then方法里面初始化了一個BScroll的實例化用

pullDownRefresh: {
//下拉到一百的位置才會觸發
threshold: 100,
//然后松手后返回50的位置
stop: 30,
}
設置了一波初始化條件
  
  接着我就不知怎么腦抽的去了componentDidUpdate這個生命周期中去監聽了pullingDown 這個事件 終於造成了一個十分尷尬的問題
就是我第二次下拉刷新的時候ajax請求一股腦的給我觸發了多次,將所有的數據全部返回了回來,這與我每次下拉觸發一次刷新一遍的
初衷大大不同,
 
  經過各種掙扎后終於和實例化和pullingDown這個事件的監聽一起提出來然后放在了componentDidUpdate這個生命周期中就解決了
此時不知道大家有沒有疑問   這個函數是掛載階段的生命周期   按我們所學的知識來說掛載階段只會執行一次呀 但是為什么這個函數里面
的事件還會執行呢 ,此時用的知識點就是發布訂閱了,關於發布訂閱請看以后分享~~~
 
 
  不過在這個題中還運到了另一個問題就是  如果我給元素設置一個自定義屬性然后通過偽類選擇器的attr將這個偽類選擇器展示到頁面
上去沒有成功   不知道哪位大佬能幫忙解決在react中怎么設置自定義屬性然后通過attr展示到頁面上去,若能解答不勝感激~~~~
 
 
     關於上面所說案例源碼請訪問https://github.com/qiang-chen/reactDemo/tree/master/day3-better-scroll


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM