// 错误示范
handler() {
console.log(this)
}
render() {
return <div onClick={this.handler.bind(this)}>测试</div>
}
可以将bind动作放在constructor中实现：
// 优化之后
constructor(props) {
super(props)
this.handler = this.handler.bind(this)
}
handler() {
console.log(this)
}
render() {
return <div onClick={this.handler}>测试</div>
}
原理：若放在render函数中，只要每次重新渲染，就会重复bind一次；放在constructor中，只会在组件初始化时执行一次，之后不会再执行。
本文将从 render 函数的角度总结 React App 的优化技巧。需要提醒的是，文中将涉及 React 16...
总结 尽量不要在render函数使用bind改变方法的this指向，如下： 可以将bind动作放在construc...
目录 1 netlify 2 Github Pages 3 无状态组件（函数式组件） 4 优化 PureCompo...
React 技巧和最佳实践 不管如何，你都应该去尝试一下当下炙手可热的 React。这篇文章我会总结一些关于 Re...
React 进阶提高 - 技巧篇 - 第 1 季（33 个视频） react 技巧 #1 如何用 netlify ...
React 进阶提高 - 技巧篇 - 第 1 季（33 个视频） react 技巧 #1 如何用 netlify ...
React 进阶提高 - 技巧篇 - 第 1 季（33 个视频） react 技巧 #1 如何用 netlify ...
React 进阶提高 - 技巧篇 - 第 1 季 react 技巧 #1 如何用 netlify 云服务部署 re...
React 进阶提高 - 技巧篇 - React Hook - 第 2 季（18 个视频） React 进阶提高 ...
前言 本文包括浏览器调试，总结的比较基础，在vue，react，angular 项目中，这些调试技巧都是可以用到的...
本文标题：React技巧总结
本文链接：https://www.haomeiwen.com/subject/ayfaxftx.html
网友评论