React学習記録(一)
6899 ワード
ノートは網易雲教室から抜粋します-Leo先生
3つのフレームワークの比較 angular 1.xバージョンMVC 2.xバージョンMVVM フレーム高さパッケージ vue mvvmフレーム インタラクション制限なし 推奨vue-resource axios xmlhttp//ajax原生 react view層に集中
Reactのメリット仮想DOM 性能が高い 端末の問題解決(pc、モバイル側の問題) JSX構文JSとの対比 表記形式:単一タグの表記形式 複数のタグの書式-外にルート要素//vue 2を包む必要がある.xコンポーネントルート(react参照) インデント可能//特性 シングルラベルルール-必ず閉じる class - className jsxでjsコード{}を使う React開発モデルダイレクト導入-シンプル(初心者好みモード)cdn導入
3つのフレームワークの比較
Reactのメリット
//js - string
let a = 'hello react!'
//jsx
let a = <div>hello react!</div>
let a = <div>hello react!</div>
let a = <div><div>sadasd</div><span>asdasd</span></div>
// An highlighted block
let a = <div>
<div>sadasd</div>
<span>asdasd</span>
</div>
//
let a = (<div>
<div>sadasd</div>
<span>asdasd</span>
</div>)
<img/>
<input/>
<br/>
<div></div>
<div className='aaa'></div>
var a = 'hello react!'; //
let b = <div>{a}</div>
// An highlighted block
<script type="text/javascript" src="bower_components/react/react.js"></script>
<script type="text/javascript" src="bower_components/react/react-dom.js"></script>
<script type="text/javascript" src="bower_components/babel/browser.js"></script>
3つのファイルを導入する必要があり、reactを先に導入する必要がある.jsはreact-domを再導入する.js