React 文档再学习 1 描述页面

本学习的资源来自于，https://beta.reactjs.org/learn

1. 组件最好是声明在最外面，不要在另一个函数里。
2. JSX 内大部分的 props / attributes 都是使用的 camalCase，由于历史原因 aria-*, data-* 使用减号连接的。
3. 使用 && 进行条件渲染的时候，左边不能使用数字，而应该是 count > 0 && <p>New Message!</p>。
4. 不要使用 key={Math.random()} 作为 key，对导致下面的 DOM 树重绘，甚至 input 失去焦点。key 只会用于 React 自有，开发者无法使用这个 prop。
5. 不要在组件内随意修改外部变量。例如下列代码会导致渲染结果无法预测。

let guest = 1;
function Cup() {
  // Bad: changing a preexisting variable!
  guest = guest + 1;
  return <h2>Tea Cup for guest #{guest}</h2>;
}

不过修改只有在 render 时使用私有变量是可以的。例如下列代码被认为是可行的。然而把 cups 挪到函数外会被认为是巨大的问题。

function TeaGathering() {
  let cups = [];
  for (let i = 0; i < 12, i ++) {
    cups.push(<span key={i}>Tea cup for guest #{i}</span>);
  }
  return cups;
}