update(reactjs-v16): context/error boundary/fragment/array components

issue #104
sabertazimi · Jul 17, 2018 · a02f7a6 · a02f7a6
1 parent 66678f8
commit a02f7a6
Showing 1 changed file with 53 additions and 0 deletions.
diff --git a/programming/web/reactjs/reactjsBasicNotes.md b/programming/web/reactjs/reactjsBasicNotes.md
@@ -24,10 +24,15 @@
     - [MVC模式](#mvc模式)
         - [Controller](#controller)
         - [Best Practice](#best-practice)
+    - [React 16 (New Features)](#react-16-new-features)
+        - [Context API](#context-api)
+        - [Error Boundary](#error-boundary)
+        - [`React.Fragment`/`Array Components`](#reactfragmentarray-components)
     - [Components/Plugins](#componentsplugins)
         - [Documents](#documents)
         - [Data](#data)
         - [Data to View](#data-to-view)
+        - [Chat](#chat)
         - [UI](#ui)
             - [Animation](#animation)
             - [Charts](#charts)
@@ -204,6 +209,54 @@ handle(e) {
 - 推荐使用ES6
 - npm的debug包，log组件渲染的每个步骤和动作
 
+## React 16 (New Features)
+
+### Context API
+
+### Error Boundary
+
+### `React.Fragment`/`Array Components`
+
+```js
+class Items extends React.Component {
+  render() {
+    return (
+      <React.Fragment>
+        <Fruit />
+        <Beverages />
+        <Drinks />
+      </React.Fragment>
+    )
+  }
+}
+
+class Fruit extends React.Component {
+  render() {
+    return (
+      <>
+        <li>Apple</li>
+        <li>Orange</li>
+        <li>Blueberry</li>
+        <li>Cherry</li>
+      </>
+    )
+  }
+}
+
+class Frameworks extends React.Component {
+  render () {
+    return (
+      [
+        <p>JavaScript:</p>
+        <li>React</li>,
+        <li>Vuejs</li>,
+        <li>Angular</li>
+      ]
+    )
+  }
+}
+```
+
 ## Components/Plugins
 
 -   [**Starter Kit Collection**](http://andrewhfarmer.com/starter-project)