如何在React.js项目中制作Twitter Bootstrap导航栏

Issue is, you are using this.props in all component but u are not passing the props values, in the code pen example you missed this part:var navbar = {};navbar.brand = {linkTo: "#", text: "React Bootstrap Navbar"};navbar.links = [ {linkTo: "#", text: "Link 1"}, {linkTo: "#", text: "Link 2"}, { dropdown: true, text: "Dropdown", links: [ {linkTo: "#", text: "Dropdown Link 1"}, {linkTo: "#", text: "Dropdown Link 2", active: true} ] }];将此代码用于 Main.js :import React from 'react';import ReactDOM from 'react-dom';var Hello = require('./components/hello');var NavBar = require('./components/navbar');var navbar = {};navbar.brand = {linkTo: "#", text: "React Bootstrap Navbar"};navbar.links = [ {linkTo: "#", text: "Link 1"}, {linkTo: "#", text: "Link 2"}, { dropdown: true, text: "Dropdown", links: [ {linkTo: "#", text: "Dropdown Link 1"}, {linkTo: "#", text: "Dropdown Link 2", active: true} ] }];ReactDOM.render( <Hello/>, document.getElementById('hello'));ReactDOM.render( <NavBar {...navbar} />, document.getElementById("navbar"));他们正在道具中传递这个物体.在您的代码中进行更改，它将起作用.They are passing this object in the props. Make the changes in your code it will work.让我知道您是否需要任何帮助.Let me know if you need any help. 这篇关于如何在React.js项目中制作Twitter Bootstrap导航栏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！