扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
这篇文章给大家分享的是有关React冒泡和阻止冒泡的使用方法的内容。小编觉得挺实用的，因此分享给大家做个参考。一起跟随小编过来看看吧。
阻止事件冒泡分三种：
1：阻止合成事件往最外层document上的事件冒泡，用e.nativeEvent.stopImmediatePropagation();
2: 合成事件间的冒泡，使用 e.stopPropagation()；
3：阻止合成事件，往处理document上的其他原生事件冒泡，需要通过e.target来判断，示例代码如下。
import React,{ Component } from 'react';
import ReactDOM,{findDOMNode} from 'react-dom';
class Counter extends Component{
constructor(props){
super(props);
this.state = {
count:0,
}
}
handleClick(e){
this.setState({count:++this.state.count});
}
render(){
return(
{this.state.count}
this.handleClick(e)}>更新
)
}
componentDidMount() {
document.body.addEventListener('click',e=>{
// 通过e.target判断阻止冒泡
if(e.target&&e.target.matches('a')){
return;
}
console.log('body');
})
}
}
var div1 = document.getElementById('content');
ReactDOM.render( 
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
微信二维码
移动版官网