認識react， 並簡單與vue對比

應用場景：

1. 負責場景下的高性能
2. 重用組件庫，組件組合

中文官網：https://reactjs.org.cn/doc/in...

特色：

1. 聲明式編碼(不須要關心如何實現，只須要關注在哪裏作什麼)
2. 組件化編碼
3. 高效的DOM Diff，最小化頁面重繪
4. 單向數據流

建立一個新的app：

npm install -g create-react-app
create-react-app my-app

cd my-app
npm start

• 使用 Yarn 安裝 React：

yarn init
yarn add react react-dom

• 使用npm來安裝 React：

npm init
npm install --save react react-dom

使用antd：

根據這個搭建環境: https://ant.design/docs/react...

react和vue同樣：

• 結合各自的生態庫構成MVC框架

react和vue不同：

• vue雙向綁定，react單項綁定
• react每次安裝新包須要從新npm install，不然會報錯：

'react-app-rewired' 不是內部或外部命令，也不是可運行的程序或批處理文件。

• 生態庫：

  vue: Vue + Vue-Router + VueX + Axios + Babel + Webpack

  react: React + React-Router + Redux + Axios + Babel + Webpack

react-router:

線上學習react地址：https://reacttraining.com/rea...
注：若是要每一個路由都是新的頁面不包含上個頁面，就添加exact

• hashHistory

  經過 hash 進行對應。好處是簡單易用，不用多餘設定。

• browserHistory

  適用於服務器端渲染，但須要設定服務器端避免處理錯誤。注意的是若使用 Webpack 開發用,服務器需加上 --history-api-fallback

  $ webpack-dev-server --inline --content-base . --history-api-fallback

• createMemoryHistory主要用於服務器渲染，使用上會創建一個存在記憶體的 history 物件，不會修改瀏覽器的網址位置。 const history = createMemoryHistory(location)