How do you import and use a Button component from React-Bootstrap 5?
Các phương án trả lời
Chọn một phương ánLời giảiChọn phương án để mở
Đáp án đúng: "import React from 'react'; import Button from 'react-bootstrap/Button'; function Demo() {
return ( <Button variant="primary">Primary Button</Button> );} export default Demo;". Component Button phải được import từ react-bootstrap/Button rồi dùng đúng tên viết hoa Button, có thẻ mở và thẻ đóng bao lấy nội dung; khi đó prop variant="primary" được React-Bootstrap đổi thành lớp btn btn-primary và chữ Primary Button hiện trên nút màu xanh. Phương án chứa "<Button variant="primary">);" sai cú pháp JSX: thẻ mở Button không có thẻ đóng mà cũng không tự đóng, nên trình biên dịch báo lỗi ngay. Phương án chứa "
<button variant="primary"> Primary Button</button>" dùng thẻ button HTML viết thường chứ không phải component đã import, nên variant chỉ là thuộc tính lạ và nút hiện ra không có kiểu Bootstrap. Phương án chứa "<button variant="primary"/> " vừa là thẻ HTML thường vừa tự đóng, không có chữ bên trong, nên chỉ ra một nút trống không kiểu dáng.