Fullstack React Ch4

23rd March 2020 at 4:34pm
Fullstack React

Why Not Modify the Actual DOM?

  1. It's hard to keep track of changes
  2. It can be slow

React 的 Virtual DOM 实现可以知道他对应的真实 DOM 有了哪些变更,以便实现局部的更新,让 UI 更新效率变快。

React’s Virtual DOM is a tree of ReactElements.:

var mountElement = document.querySelector('#root');
// Third argument is the inner text
var boldElement = React.createElement('b', null, "Text (as a string)");
ReactDOM.render(boldElement, mountElement);

JSX

JSX 是 JavaScript Syntax Extension 的简写。它用一种简单的语法创建 React Element。书里面的内容在 JSX: Core Concepts 里都有提及,主要是官方文档加一些演绎。