react 事件处理 render

事件处理

通过 onXxxx 属性指定事件处理函数(小驼峰形式)

通过 event.target 可以得到发生事件的 dom 元素

使用 JSX 语法时你需要传入一个函数作为事件处理函数,而不是一个字符串。

在原生 DOM 中,我们可以通过返回 false 来阻止默认行为,但是这在 React 中是行不通的,在 React 中需要明确使用 preventDefault() 来阻止默认行为。

事件回调函数里的 event 是经过 React 特殊处理过的(遵循 W3C 标准),所以可以放心地使用它,而不用担心跨浏览器的兼容性问题。

注意:在使用事件回调函数的时候,需要特别注意 this 的指向问题。

因为在 React 里,除了构造函数和生命周期钩子函数里会自动绑定 this 为当前组件外,其他的都不会自动绑定 this 的指向为当前组件,因此需要我们自己注意好 this 的绑定问题。

通常而言,在一个类方式声明的组件里事件回调,需要在组件的 constructor 里绑定回调方法的 this 指向。

render函数

当组件的 state 或者 props 发生改变的时候,render 函数就会重新执行

当父组件的 render 函数重新执行时,子组件的 render 函数也会重新执行

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容