關於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展示到頁面上去,若能解答不勝感激~~~~