Question

我的navbar.jsx文件中出现此错误.Navbar在react-bootstrap.js中定义。我将react-bootstrap.js添加到我的包中，但它仍然无效。怎么解决？

var MyNavbar = React.createClass({
    render: function () {
        return (<Navbar>
        <Navbar.Header>
          <Navbar.Brand>
            <a href="#"></a>
          </Navbar.Brand>
          <Navbar.Toggle />
        </Navbar.Header>
        <Navbar.Collapse>
          <Nav pullRight>
              <MenuItem eventKey={1}>...</MenuItem>
              <MenuItem eventKey={2}>...</MenuItem>
              <MenuItem eventKey={3}>...</MenuItem>
              <MenuItem eventKey={4}>...</MenuItem>
          </Nav>
        </Navbar.Collapse>
        </Navbar>);
    }
});
ReactDOM.render(<MyNavbar/>,document.getElementById('navbar'));

我试图将我的js和jsx文件捆绑到_Layout.cshtml

public class BundleConfig
{
    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new BabelBundle("~/bundles/main").Include(
            "~/Scripts/react/react.js",
            "~/Scripts/react/react-dom.js",
            "~/Scripts/react/react-bootstrap.js",
            "~/Scripts/jquery-1.10.2.js",
            "~/Scripts/modernizr-2.6.2.js",
            "~/Scripts/Components/Navbar.jsx"
        ));
        BundleTable.EnableOptimizations = true;
    }
}

Layout.csthml

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title</title>
    <link href="~/Content/Site.css" rel="stylesheet" type="text/css" />
    <link href="~/Content/bootstrap.min.css" rel="stylesheet" type="text/css" />
</head>
<body>

    <div id="navbar"></div>
    @RenderBody()
</body>
</html>
@Scripts.Render("~/bundles/main")

React.js - 未定义Navbar

0 个答案: