phản ứng bootstrap - thêm thuộc tính bsStyle tùy chỉnh vào nút

Question

Tôi đang sử dụng phản ứng-bootstrap cho dự án của tôi và tôi đang cố gắng thêm thuộc tính bsStyle tùy chỉnh vào thành phần nút. Nếu tôi sử dụng các lớp khởi động mặc định theo liên kết sau http://react-bootstrap.github.io/components.html#buttons tên lớp được hiển thị đúng. Tuy nhiên nếu tôi thay đổi thuộc tính thành bsStyle='facebook', nó sẽ hiển thị btn-undefined

Vì vậy, trong ngắn hạn, tôi không biết gì khi tôi chuyển sai khi tôi chuyển thuộc tính bsStyle cho nhóm trong bootstrap phản ứng.

này được HTML của tôi trông giống như

<Button id="facebook-btn" bsStyle="facebook" bsSize="large" block> 
</Button> 

và nếu tôi thay đổi mã của tôi để

<Button id="facebook-btn" bsStyle="primary" bsSize="large" block> 
</Button> 

nó hoạt động tốt và lớp được trả lại đúng.

Đây là log console html

Answer 1

Got nó làm việc với styleMaps bằng cách định nghĩa trong phần gốc của tôi:

Với phản ứng-bootstrap 0.23.7 ​​

import {styleMaps} from 'react-bootstrap'; 

styleMaps.addStyle('facebook'); 

EDIT:

Bây giờ với react- bootstrap 0.30.x

import {addStyle} from 'react-bootstrap/lib/utils/bootstrapUtils'; 
import Button  from 'react-bootstrap/lib/Button'; 

addStyle(Button, 'facebook'); // can add more params for more styles 

EDIT 2:

liên kết tài liệu chính thức: Custom Styles

EDIT 3:

Khi tôi đã di chuyển thiết lập của tôi từ browserify để webpack2 nó không hoạt động với cú pháp này nữa, thay đổi nó để làm việc này mặc dù:

// import Button from 'react-bootstrap/lib/Button'; // previous 
import {Button} from 'react-bootstrap'; 

Answer 2

Hình như giá trị có sẵn cho bsStyle là:

• chính
• thành công
• thông tin
• cảnh báo
• liên kết

Vì vậy, khi cố gắng tìm kiểu facebook không thành công, do đó, nó được đặt thành không xác định.

Answer 3

Bạn đã thấy yêu cầu kéo này: https://github.com/react-bootstrap/react-bootstrap/pull/496. Tôi sẽ sớm xuất bản bản phát hành với thay đổi này.