React学习-事件处理基础，Java工程师最容易遇到4个瓶颈是什么

• 先来新建一个input输入框（注意React中单标签要闭合带上/）

• 现在实现输入什么内容下面同步更新一样的内容，如果是响应式Vue就直接数据双向绑定使用v-model即可，react需要多一些操作。

• 首先在constructor构造器里面定义

this.state = {msg:‘’}

• 对input标签绑定事件

• 在这个fnInput函数中，使用

this.setState({ msg:e.target.value})

去更新状态state中的msg的值

测试代码

绑定事件函数传参方式

fnInput(a,e){

console.log(a);

this.setState({

msg:e.target.value

})

}

• tips：标签中入参写后面，接收参数时，形参写前面

阻止浏览器默认事件

• 写一个button，带点击弹窗事件

这时点击右键，弹出窗口，再点击确定，就弹出了浏览器的默认右键事件

如何解决呢？

我们只需要对funcMenu函数做一个小小的改造

funcMenu(e){

alert(666)

e.preventDefault()

}

带上 e.preventDefault()这句就可以成功阻止浏览器的默认事件

阻止冒泡事件