tsx在jsx的基础上添加了新的类型，除此之外没有任何区别
事件绑定
function App() {
const handleClick=()=>{
console.log('button被点击了');
}
return(
<div className="App">
<button onClick={handleClick}>click me</button>
</div>
)
}
export default App
传递自定义参数
需要指定箭头函数的形式
function App() {
const handleClick=(name)=>{
console.log('button被点击了',name);
}
return(
<div className="App">
<button onClick={()=>handleClick('jack')}>click me</button>
</div>
)
}
export default App
如果需要同时传递事件对象与自定义参数
需要在传递自定义参数的箭头函数的括号里面传递事件e
function App() {
const handleClick=(name,e)=>{
console.log('button被点击了',name,e);
}
return(
<div className="App">
<button onClick={(e)=>handleClick('jack',e)}>click me</button>
</div>
)
}
export default App