react項目中遇到的坑


1,touchStart和touchEnd

如果touchstart和touchend改變的是同一個state,那么在首次加載渲染的時候組件會陷入死循環,原因是touchstart會直接觸發,但此時state也在初始化,導致state不停的變化。

解決方法:onTouchStart={() => {this.touchstart(index)}},給touchstart傳一個匿名函數就可以了

問題升級:如果用map方法循環return一個組件,第一次加載的時候組件上綁定的所有的方法都會執行一遍,包括onClick這些,那么解決方法同上,綁一個匿名函數就可以了

2,樣式沖突問題

雖然我們引入了css-modules,但是我們卻發現這樣一個現象:首次打開A頁面,引入了A的css文件,這時候再打開B界面,又引入了B的css文件,而A的css文件還在,再打開C界面,又引入了C的css文件,而此時已經有了A,B,C三個css文件了。。。。我們期望的效果是打開A,只有A的css,打開B,只有B的css。。。,然而我查了很多資料,卻發現沒有辦法這樣,我又看了一下vue的實現,vue也是這樣,不能實現我們期望的樣式組件分離。

解決方法:在每個組件的最外面div設一個classname,然后在對應的css文件最外層就包一個這個classname,這樣就能簡單的解決樣式沖突問題

 


免責聲明!

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



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