Reactjs - render HMTL
04/01/2022 React
Reactjs - render HMTL
Reactjs - render HMTL
- Mục tiêu của React theo nhiều cách là hiển thị HTML trong một trang web.
- React kết xuất HTML cho trang web bằng cách sử dụng một hàm có tên là ReactDOM.render ().
1. Hàm Render trong file index.js
|
- có 2 tham số là html code và html element
- Mục đích của hàm là hiển thị mã HTML được chỉ định bên trong phần tử HTML được chỉ định.
2. HTML Code
Mã HTML sử dụng JSX cho phép bạn viết các thẻ HTML bên trong mã JavaScript:
3. Nút Root
Nút gốc là phần tử HTML mà bạn muốn hiển thị kết quả.
Nó giống như một vùng chứa nội dung do React quản lý.
Nó KHÔNG phải là một phần tử <div> và nó KHÔNG phải có id = 'root':
VD: đổi tên nút gốc
index.js
| import React from 'react'; import ReactDOM from 'react-dom'; ReactDOM.render(<p>Hallo</p>, document.getElementById('sandy')); //Click the "index.htm" tab to see the container "sandy". |
index.html
| <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>React App</title> </head> <body> <header id="sandy"></header> </body> </html> |
Cám ơn
TƯ VẤN MIỄN PHÍ
XÂY DỰNG ỨNG DỤNG & WEBSITE
Bài viết cùng chủ đề
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|