• 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,这样就能简单的解决样式冲突问题

  • 相关阅读:
    图的理论基础
    哈夫曼树(三)之 Java详解
    哈夫曼树(二)之 C++详解
    哈夫曼树(一)之 C语言详解
    基数排序
    桶排序
    归并排序
    堆排序
    选择排序
    希尔排序
  • 原文地址:https://www.cnblogs.com/yanchenyu/p/7865074.html
Copyright © 2020-2023  润新知