重点整理

• 事件命名上必须使用小驼峰，且为 String
• 事件中必须放一个回传 Function

return (
  <button onClick={() => {}}>事件</button>
  <button onClick={clickHandler}>Submit</button>
)

注意

记得如果我们替事件加上 ()，代表程序会直接执行

我们直接看范例好嘞，不然感觉好像在讲废话，以下面为例

会进入一个无限回圈状态!

const [state,setState] = useState(1);

const clickHandler = (e) => {
    // 执行函式
    e.preventDefault();
    setState(state +1);
}

return (
  <button onClick={clickHandler()}>Submit</button>
)

补充

1. 刚好看到一个产生阵列数量的小技巧，纪录一下

[...Array(5).keys()]
//[0,1,2,3,4]

1. 为何不能在 JSX 中撰写 for 回圈，是因为 for 回圈本身是个 Statement，并不会有回传值。所以以此类推没有回传值的方法都不能写在 JSX 中。