<center>使用React过程中的那些坑</center>

刺骨的言语ヽ痛彻心扉 2024-04-20 00:19 3阅读 0赞

在使用react两年过程中，遇到了各种坑

在使用React框架开发项目的过程中，遇到各种各样的bug，每次定位bug查找原因都花了不少时间，并且遇到相同bug的概率特别大，就把bug产生原因和解决方法做一个持续的记录。

Module not found: Error: Cannot resolve module 'react/lib/ReactMount'

凡是Module没有找到，那就是因为没有这个模块，重装npm包或者看看是否因为升级而取消了某个包

Unknown props `visible`, `onCancel`, `onCreate` on <locCreateForm> tag.

这个错误是标签写错了，因为没有大写 ，一般报这个错误不是因为标签写错了就是因为属性写错了

Warning: setState(...): Cannot update during an existing state transition (such as within `render` or another component's 
    constructor). Render methods should be a pure function of props and state; constructor side-effects are an anti-pattern,
    but can be moved to `componentWillMount`.

<span onClick=\{()=>\{this.showModifyModal(value)\}\}>修改  
在span的onClick事件中 我使用showModifyModal函数并向其中传参 会报错  
但是如上包裹一层便可以解决

Super expression must either be null or a function, not undefined

import引入组件的时候  
路径错误或者使用\{\}的方式引入一个组件

Cannot read property '_currentElement' of null

如果state里面没有赋予初始值 在render函数里面读不到

You should not use <Route component> and <Route children> in the same route

http://www.cnblogs.com/sylarmeng/p/6920903.html

This git repository has untracked files or uncommitted changes

当我想使用 npm run eject时 报这个错 这时git add 再commit和push

create-react-app项目添加less配置  
https://segmentfault.com/a/1190000010162614

Element from loaders list should have 'loader' or 'loaders' with sass-loader webpack

这个属于在webpack中配置less失败，需要正确的配置less

Error: `output.path` needs to be an absolute path or `/`.
    启动 webpack-dev-server 时报错，在 webpack.config.js 里修改 output.path
    var path = require('path');
    output: {
    path: path.join(__dirname, './dist/'),
    filename: 'js/[name].js'
    }
    
    是用BrowserRouter还是HashRouter

react-router4的文档用的是BrowserRouter，照着文档的demo写，发现第一次路由过去的路径能正常显示，再刷新页面就发现说找不到路径了，这就纳闷了，不知道哪里出了问题。后来得知BroswerRouter是需要服务端配合的，服务端重定向到首页，BrowserRouter是基于html5的pushState和replaceState的，很多浏览器不支持，存在兼容性问题。故最后选择HashRouter