1.angular react vue區別
1.angular1.x mvc 2.x mvvm
都給你限制了 $http -> ajax
2. vue2mvvm框架 不限制
推薦vue-resource
3.react更專注於view層
react
優勢：1.虛擬dom
2.效能性很高
3.解決一些終端的問題（pc、移動端問題）
劣勢：1.學習成本很高、學習曲線很陡
2.react本身能做的事並不多，想做大東西必須得用react外掛程式（全家桶）
4.react - vue、ng不同的一點： react不限制你的使用方式
2.理解作者思想 --》接受它的世界觀---》接受它的中二設定--》自定義語法 - jsx
3.書寫格式
1.多個標籤的書寫格式 - 外面必須包一層根元素，可以自由縮排
2.單標籤規則 - 必須閉合
3.class - classname引用樣式
4.jsx裡面使用js**必須加{}
5.jsx - 支援style - 裡面使用json }---》第一層是使用告訴jsx我要用js了---》第二層的是json的
6.事件：使用駝峰命名法 ---》第乙個單詞之後的首字母大寫---》onclick -> onclick----》onmouseover -> onmouseover
4.物件導向
1.es6之前那種 函式 -new 函式 = 類
類 - constructor
原型 - prototype （所謂的方法）
原型鏈 - __proto__
2.es6=class
constructor - 預設執行的函式
不支援變數提公升
class 函式名稱---》函式呼叫時 預設執行 constructor 函式----》constructor - 裡面寫一些初始的內容
3.繼承 extends 可以繼承原型和私有屬性
如果子類想使用 this---》子類constructor 放入super ---》引數如果想使用，子類引數放入 constructor 和 super 中
5.獲取元素起碼有三種方法
1.獲取：this.refs.aaa
2.獲取本身事件源 e.target
3.原生js的獲取方法
6.react生命週期
componentwillmount()componentdidmount()
componentwillupdate()
componentdidupdate()
componentwillunmount()
7.react阻止事件冒泡
//return false;
= true;
= true;
都不好使
e <-react封裝過的nativeevent 原生的事件物件
e.nativeevent.stopimmediatepropagation()停止立即的傳播
8.react表單---(前面加default屬性)
input --->受控表單/非受控表單受控
value='' checkbox defaultvalue='' defaultchecked=''
9.react互動
並不限制你如何的去互動
10.react --for迴圈和顯示隱藏
class yxk extends react.component}render())
})
return (this.state.arr.length>0?'none':'block'}}>
) }}
reactdom.render(
, )
虛擬dom 每乙個內容都應該有自己的唯一標識key
11.react元件通訊傳值
1.父給子元件傳值
this.props.msg
預設情況下 父元件從新渲染 會統一同步 ---》不想同步 就把父元件的值存成子元件的乙個state
2.子元件拿父元件值
子元件裡面執行函式----》this.props.fn(傳入子元件的資料)
React 基本語法
一 宣告元件 1.建立元件檔案 兩種寫法 在components資料夾中新建乙個home.js檔案 import react,from react 宣告元件的類 class home extends component export default home 在components資料夾中新建乙個c...
React 基本語法
目錄 一 元件的使用 1.1 宣告元件 1.2 掛載元件 二 在元件裡宣告資料及繫結資料 三 在元件中繫結屬性 四 引入 有倆種寫法 寫法一 在components元件中新建home.js 檔案 import react,from react 宣告元件的類 class home extends co...
React基本語法，注釋 插值
render接收兩個引數，乙個jsx語法的節點模板，乙個是渲染到那個元素物件上 會成為其子節點 text babel const element hello react h1 reactdom.render element,document.queryselector script text bab...