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

在使用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

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值