Hi ! Hoàng đang có 2 class render A và B viết bằng ReactJS. Hoàng phải làm sao để màn hình PC 1200px thì class A sẽ được hiển thị ra trình duyệt còn nếu trên mobile 700px thì class B sẽ được render.
Cảm ơn cả nhà đã giúp đỡ Hoàng 🙆
file A.js
import React, { Component } from 'react';
class A extends Component {
}
render() {
return (
<div>
Đây là component
dành cho PC
</div>
);
}
}
export default A;
file B.js
import React, { Component } from 'react';
class B extends Component {
}
render() {
return (
<h1>
Đây là component
dành cho mobile
</h1>
);
}
}
export default B;
file index.js
import React from 'react';
import ReactDOM from 'react-dom';
import A from './A.js';
import B from './B.js';
ReactDOM.render(
<A />
<B /> ,
document.getElementById('root')
);
file index.html
<html>
<head>
</head>
<body>
<div id="root"></div>
</body>
</html>
. Nói chung, cái này liên quan đến CSS là chủ yếu, ngoài ra cũng có liên quan đến HTML, ví dụ như: Cắt giảm những thứ hiển thị lên mobile,…
? Quan trọng là biết sắp xếp, tối ưu (đặc biệt là về CSS) ra sao cho phù hợp thôi. Mà bạn thử check source code khi hiển thị trên mobile chưa? Làm gì có chuyện vô lý là DOM elements trên điện thoại và PC lại khác nhau được, cả hai đều theo một tiêu chuẩn chung mà? Về vấn đề bạn nói ở trên thì có hai cách:
, nhưng mình muốn trên PC với trên điện thoại hiển thị tag html và nội dung cũng khác nhau. Không biết có cách nào làm được không nhỉ ? web cùng một domain luôn không phải dạng như
83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?