React-bootstrap

作者: 花本惠 | 来源:发表于2018-01-09 18:30 被阅读0次

1、react-bootstrap是什么?

      React-Bootstrap是可重用的前端组件库。

2、react-bootstrap和bootstrap的关系?

      react-bootstrap的样式组件依赖于bootstrap。(如下图1是官网的解释)

图1

3、在react中如何使用React-bootstrap?

      3.1、安装:cnpm  install react-bootstrap  --save;

       3.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.3、在index.ejs的模板头部,引入bootstrap.css。

3.4、在dist文件夹下放入bootstrap.css源码。

相关文章

  • react 插件

    架构 react-bootStrap React-Bootstrap目前针对Bootstrap v3。要使用Rea...

  • React-bootstrap

    1、react-bootstrap是什么? React-Bootstrap是可重用的前端组件库。 2、react...

  • React轮播-----react-bootstrap

    React项目 使用轮播图 React-bootstrap中的轮播(Carousel)模块参考github: ht...

网友评论

    本文标题:React-bootstrap

    本文链接:https://www.haomeiwen.com/subject/kxygnxtx.html