React入門教程(二)

2021-07-11 20:32:35 字數 1733 閱讀 4648

react基礎總結(續)

示例**:

commentbox

=react

.createclass(,

"hello, world! i am a commentbox.")

);}});

reactdom

.render

(react

.createelement

(commentbox

,null

),document

.getelementbyid

('content'));

解析:

react.createclass()

來建立乙個新的 react 元件;

render方法:

該方法返回一棵 react 元件樹,這棵樹最終將會渲染成 html,reactdom.render()例項化根元件,啟動框架,把標記注入到第二個引數指定的原生的 dom 元素中;

標籤:

不是真正的 dom 節點;他們是 reactdiv元件的例項。

元件屬性:

元件的屬性可以在元件類的this.props物件上獲取,比如name

屬性就可以通過

this.props.name讀取。

讓我們建立comment元件,該元件依賴於從父級傳入的資料。從父元件傳入的資料會做為子元件的屬性( property ),這些屬性( properties )可以通過this.props訪問到。使用屬性( props ),我們就可以讀到從commentlist傳到comment的資料,然後渲染一些標記:

示例:var

comment

=react

.createclass

(<

/h2>

<

/div>);

} });this.pros.children

this.props物件的屬性與元件的屬性一一對應,但是有乙個例外,就是this.props.children屬性。它表示元件的所有子節點

注意:this.props.children的值有三種可能:如果當前元件沒有子節點,它就是undefined;如果有乙個子節點,資料型別是object;如果有多個子節點,資料型別就是array。所以,處理this.props.children的時候要小心。

react 提供乙個工具方法react.children來處理this.props.children。我們可以用react.children.map來遍歷子節點,而不用擔心this.props.children的資料型別是undefined還是object。更多的react.children的方法

Docker 入門教程(二)

首先,讓我們通過下面的命令來檢查docker的安裝是否正確 docker info 如果沒有找到這條命令,則表示docker安裝錯誤。如果安裝正確,則會輸出類似下面的內容 到 這一步docker裡還沒有映象或是容器。所以,讓我們通過使用命令預先構建的映象來建立來乙個 sudo docker pull...

Robotframework 入門教程(二)

變數 rf用 分別表示標量,列表,和字典,對應的就是python中的sre,list和dict。rf中variables用來建立變數。修改我們的demo.robot如下,對應於python的語法 var value list1 a b c var dict1 variables value a b ...

CMake入門教程(二)

1 使用set進行變數設定 之前使用 aux source directory命令將目錄下的所有.cpp檔案儲存到變數裡面,這樣,我們就不用乙個乙個去新增原始檔來生成可執行檔案,其實我們使用set命令也可以完成此操作。將untile.h以及untile.cpp兩個檔案新增到srcpath這個變數裡面...