Day 17 - Event Handling

使用大括号与驼峰式命名来处理 DOM 是它与原生 jS 的差别。

//jS 写法
<button onclick="myFunction()">Click me</button>
//React 写法
<button onClick="myFunction()">Click me</button>

这边有个小考题，我不得不再去复习一下运算子~

题目：当按了三次之後，按钮会显示什麽文字？

function Toggle2() {
  const [val, setVal] = useState("ON");
  function toggle3 () {
    setVal((val == "ON")?"OFF":"ON");
  }
  return <p><button onClick={toggle3}>{val}</button></p>;
}
const el12 = <Toggle2 />
ReactDOM.render(
  el12,
  document.getElementById('root14')
)

复习区

条件运算子 是 JavaScript 中唯一需要三个运算元的运算子。 这个运算子接受两个运算元作为值且一个运算元作为条件。 语法是:

条件 ? 值1 : 值2
如果 条件 为 true，运算子回传 值1， 否则回传 值2。 你可以在任何使用标准运算子的地方改用 条件运算子。

相关文章：

运算式与运算子