Tài liệu lập trình front end reacjs SLIDE 2

Free style Component: function class React component: props Component nesting (component lồng nhau) Component reuse (sử dụng lại component) Free style Component: function class React component: props Component nesting (component lồng nhau) Component reuse (sử dụng lại component

Trang 1

Conceive Design Implement Operate

THỰC HỌC – THỰC NGHIỆP

http://www.poly.edu.vn

Trang 2

M ỤC TIÊU

Free style

Component: function & class

Trang 4

B ONUS

❖ Truy xuất đường link https://semantic-ui.com/

Trang 5

B ONUS

❖ Truy xuất đường link

https://cdnjs.com/libraries/semantic-ui

Trang 6

B ONUS

Trang 7

loại chính: function và class

Trang 8

F UNCTION COMPONENT

Trang 9

F UNCTION COMPONENT

Nội dung JSX

Free style sematic-ui

Trang 10

T RÍCH JSX > NEW COMPONENT

Trang 11

Single

Duplicate

Trang 12

Trang 13

Trang 14

C OMPONENT NESTING

Trang 15

Trang 16

Trang 17

C LASS COMPONENT

Trang 18

Trang 19

Trang 22

P ROPS

Trang 23

P ROPS

Trang 24

P ROPS

Trang 25

P ROPS

giống như đối số trong hàm javascript và thuộctính trong HTML)

Trang 26

P ROPS

❑Gửi 1 props (index.js)

Trang 27

P ROPS

Trang 28

P ROPS TRONG FUNCTION COMPONENT

Trang 29

P ROPS TRONG CLASS COMPONENT

Trang 30

P ROPS TRONG CLASS COMPONENT

constructor function Nhận props như sau

Trang 31

D EFAULT PROPS

❑Cách 01: Sử dụng cú pháp

Trang 32

D EFAULT PROPS

Trang 33

D EFAULT PROPS

Trang 35

D EFAULT PROPS

❑Ví dụ:

Trang 36

D EFAULT PROPS – P ROP T YPES

Trang 37

C OMPONENT REUSE

Trang 38

C OMPONENT REUSE

Trang 40

S UMARRY

Component: function & class

Tiêu đề	Tài Liệu Lập Trình Front End ReactJS Slide 2
Trường học	Polytechnic University
Chuyên ngành	Front End Development
Thể loại	Lecture Notes

Định dạng
Số trang	41
Dung lượng	3,04 MB