Bootstrap有react版嗎

Bootstrap有react版的，名稱為React-Bootstrap，是一款基於React對Bootstrap進行封裝的函式庫，是可重複使用的前端元件庫。

本教學操作環境：Windows7系統、bootstrap4&&react16版本，此方法適用於所有品牌電腦。

（推薦教學：React影片教學、bootstrap教學）

Bootstrap有react版的，名稱為React-Bootstrap。

React-Bootstrap是一款基於ReactJS對Bootstrap進行封裝的函式庫，是可重複使用的前端元件庫。

官網：https://react-bootstrap.github.io

GitHub：https://github.com/react-bootstrap/react-bootstrap

react- bootstrap的樣式元件依賴bootstrap（如下圖是官網的解釋）。與 Twitter Bootstrap 一致外觀與感受，但透過 Facebook 的 React.js 框架獲得更清爽的程式碼。

react中使用React-bootstrap

1、使用下列指令進行安裝

cnpm  install react-bootstrap  --save
//或者
$ bower install react react-bootstrap

2、寫內容元件要用到react-bootstrap的元件的時候，要從react-bootstrap中匯入所需的元件；

例如：在元件component.js中，要用到React-bootstrap的Button元件，具體寫法如下：

  import React  from‘react’;
                 import  {Button} from ‘react-bootstrap’;
                 export  default class  MyComponent  React.Component{ 
                           constructor(props){
                                  super(props);
                                                       }
                                   render(){
                                            return(
                                                   <div>
                                                          <Button bsStyle="default"></Button>
                                                  </div>          
                                              );
                                             }
                                           };

3、在index.ejs的模板頭部，引入bootstrap.css。

4、在dist資料夾下放入bootstrap.css原始碼。

更多程式相關知識，請造訪：程式設計教學！ ！

以上是Bootstrap有react版嗎的詳細內容。更多資訊請關注PHP中文網其他相關文章！