您的位置:首页 > 科技 > IT业 > react事件绑定

react事件绑定

2024/12/23 6:16:28 来源:https://blog.csdn.net/m0_68716504/article/details/140478238  浏览:    关键词:react事件绑定

react基础事件绑定


function passwordChange(e){console.log(e.target.value);
}
function usernameChange(e){console.log(e.target.value);
}function App() {return (<div><input type="text" placeholder='请输入用户名'onChange={usernameChange}/><input type="text" placeholder='请输入密码' onChange={passwordChange}/></div>);
}export default App;

 同时传递事件对象和自定义参数

需要使用箭头函数


function loginbtn(type,e){switch (type) {case 1:console.log('登录');break;case 2:console.log('注册');break;}
}
function App() {return (<div style={{width:'500px', height:'300px',background:'#ccc',margin:'200px auto'}}>{logintrue ?<button onClick={(e)=>loginbtn(1,e)}>登录</button>:<button onClick={(e)=>loginbtn(2,e)}>注册</button>}</div>);
}export default App;

 其它事件方法如上

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com