Question

所以我目前正在开发一个用Flask编写的项目，我添加了Bootstrap。我最近开始添加一些反应组件，我希望它们看起来像其他自举组件。以下是我的一些代码：

这是我在bootstrap.js文件和react.js文件中包含的地方

    <script src="/static/js/bootstrap.min.js"></script>
    <script src="/static/js/build/react.js"></script>
    <script src="/static/js/build/JSXTransformer.js"></script>
    <script src="/static/js/react-bootstrap-bower/react-bootstrap.js"></script>

这个html通常由bootstrap呈现为精彩的小型寻呼机图标，但不是反应：

return (
        <div>
            <nav> 
                <ul className="pagination pagination-lg">
                    <li>
                        <a href="#" aria-label="Previous">
                            <span aria-hidden="true">&laquo;</span>
                        </a>
                    </li>
                    <li>
                        <a href="#" aria-label="Next">
                            <span aria-hidden="true">&raquo;</span>
                        </a>
                    </li>
                </ul>
            </nav>

我知道我没有完全回报，但问题的回归不是手头的问题，而是它的造型。我尝试使用以下

添加Pager元素

var Pager = ReactBootstrap.Pager;
...
//inside some html return
<Pager></Pager>

但我首先得到的反应是没有定义ReactBootstrap。但是我读到当你包含js文件时会自动创建ReactBootstrap全局。另一个反应是Pager不存在（显然，因为ReactBootstrap无法返回它）。

所以我的问题是，我可以简单地返回没有data-reactid信息的html，或者某种方式让它由bootstrap呈现而不需要reactBootstrap？或者我的文件中缺少什么东西来使用reactBootstrap。在此先感谢您的帮助！

Answer 1

我尝试在jsbin中重现它，但ReactBootstrap.Pager是一个组件，它使用正确的样式呈现。

你没有正确加载东西。

ReactBootstrap全局未定义

1 个答案: