React筆記 2 react語法1

這一節內容主要以了解為主。

漸漸的體會react的語法和其特性。

① htmlandjs 混合編寫

react和以往的前後臺書寫方式不一樣。

在之前的多個語言中，講求的是將頁面**和js**邏輯分開，包括原來的css檔案都有獨立的分裝。

而react的提供了一種html和js語句混合編寫的方式。這就是jsx。

先不詳說，體會一下先：

1

var arr =[ 2, 
345 ];
6//將html裝到陣列裡面
7reactdom.render( 
8② props和省略號語法
props物件的屬性與元件的屬性一一對應.
'use strict';
import react, from 'react';
import reactdom from 'react-dom';
//宣告乙個元件類，叫mytitle
class mytitle extends component
//渲染元件：乙個按鈕，並可以點選。
//注意bind(this)的寫法，這是jsx語法要求的
//如果嫌麻煩也可以使用箭頭函式。
render()
}//要向元件傳遞的資料
var data = ;
reactdom.render(
,);

上述**實際上渲染出來的是乙個button。

詳細的說明看我的注釋就好了。

③ this.props.children

在這個屬性中獲取傳入的dom的節點資訊。

可以用 react.children.map方法遍歷。

'use strict';

import react, from 'react';
import reactdom from 'react-dom';
class nodelist extends component
}reactdom.render(
hello
world
,);

參考：

React筆記 4 react語法3

生命週期 很多語言中都講了關於生命週期。這可是決定生命的周始，有沒有存在感的關鍵啊。生命週期，有生有死，有始有終，因果輪迴，迴圈往復。說多了 react中，主要說明的是 乙個元件的生命週期。簡單來講就是 初始化 渲染 更新 渲染 銷毀 最常用的三個生命週期 1.componentwillmount ...

2 react 程式設計實踐 俄羅斯方塊 環境搭建

1.建立 demo 目錄 mkdir demo 2.初始化應用 npm init 工程資訊 package name tetris class demo version description tetris game entry point test command git repository k...

React 基本語法

一 宣告元件 1.建立元件檔案 兩種寫法 在components資料夾中新建乙個home.js檔案 import react,from react 宣告元件的類 class home extends component export default home 在components資料夾中新建乙個c...