React 簡介入門

2021-07-27 10:01:46 字數 1693 閱讀 6414

一.react是facebook推出的乙個用來構建使用者介面的js庫。最新版本v15.3.2。具備以下特性:

1.不是乙個mvc框架;

2.不適用模板;

3.響應式更新非常簡單;

4.html5僅僅是個開始

二.react實現了單向相應的資料流,從而減少了重複**,比傳統資料繫結更簡單。

三.react元件通過乙個render()方法,接受輸入的引數並返回展示的物件。

四.在js**裡寫xml格式的**稱為jsx,為了把jsx轉成標準的js,我們使用標籤包裹著包含jsx的**,然後引入jsxtransformer.js庫來實現在瀏覽器裡的**轉換。

五.離線轉換

1.安裝npm:npm install -g rect-tools

2.把jsx檔案轉換成標準的js(檔案會自動生成):jsx --watch src/build/ 由

: ,生成:react.createelement('h1',null,'hello world!'),(這個時候就不需要引用jsxtransformer.js)

六.jquery對於react並不是必須的,react中全是模組化、可組裝的元件。

七.元件

構造commentbox元件(其實只是乙個簡單的而已)

var commentbox = react.createclass(

});reader.render(

, document.getelementbyid('content')

);

製作元件:為 commentlist 和 commentform 構建骨架,這也會是一些簡單的 :

var commentlist = react.createclass(

});

var commentform = react.createclass(

});

更新 commentbox 元件,使用這些新的元件:

var commentbox = react.createclass(

});

html 元件就是普通的 react 元件,就像你定義的一樣,只有一點不一樣。jsx 編譯器會自動重寫 html 標籤為

react.createelement(tagname)表示式,其它什麼都不做。這是為了避免全域性命名空間汙染。

元件屬性:從父節點傳遞到子節點的資料稱為屬性(props)。通過props,就能夠從中讀取到父節點傳遞過來的資料,然後渲染標記。  

markdown:是一種簡單的格式化內聯文字的方式。例如,用星號包裹文字講使其強調突出。

1.新增第三方的showdown到你的應用。

props 是不可變的:它們從父節點傳遞過來,被父節點「擁有」。為了實現互動,我們給元件引進了可變的state。 this.state 是元件私有的,可以通過呼叫 this.setstate() 來改變它。當狀態更新之後,元件重新渲染自己。

getinitialstate()在元件的生命週期中僅執行一次,設定元件的初始化狀態。

react 中資料是沿著元件樹從上到下單向流動的。

CRF 簡介入門

conditional random field 條件隨機場,一種機器學習技術 模型 crf由 john lafferty 最早用於 nlp技術領域,其在 nlp技術領域中主要用於文字標註,並有多種應用場景,例如 本文主要描述如何使用 crf技術來進行中文分詞。1.crf 把分詞當做字的詞位分類問題...

KOA框架簡介,入門指引

koa 是乙個新的 web 框架,由 express 幕後的原班人馬打造,致力於成為 web 應用和 api 開發領域中的乙個更小 更富有表現力 更健壯的基石 koa git master find type f name js grep v test lib context.js lib resp...

React之元件簡介

這一篇大概介紹一下react中的元件,那麼首先我們要了解什麼是組建。在乙個html頁面當中所有的模組我們都可以理解為乙個元件,在react中只要被渲染出來的都是元件。例如乙個按鈕,乙個文字框,都是乙個元件,而這些元件在react中是如何具體體現的呢?下面我們就來通過 示例來介紹元件。1.新建乙個de...