Typescript React React.createElement：typeはnull、未定義、ブール値、または数値であってはなりません。

Question

私はTypeScript（1.8.10）を使用しており、学習は反応しています。 React-Bootstrapを使って簡単なナビゲーションを作成していますが、次のようなエラーが表示されています。このエラーは、DOMがレンダリングされないようにします。私は全く新しい反応を示すので、ここで間違っていることを確かめないでください。このエラーを回避するための助けや指導をいただき、ありがとうございます。

// A '.tsx' file enables JSX support in the TypeScript compiler, 
// for more information see the following page on the TypeScript wiki: 
// https://github.com/Microsoft/TypeScript/wiki/JSX 
/// <reference path="./../../../typings/index.d.ts" /> 

import * as React from 'react'; 
import * as ReactBootstrap from 'react-bootstrap'; 
interface INavigationProps { 
} 

let Navbar = ReactBootstrap.Navbar; 
let NavItem = ReactBootstrap.NavItem; 
let MenuItem = ReactBootstrap.MenuItem; 
let NavbarHeader = ReactBootstrap.NavbarHeader; 
const dropdownItems = [ 
    { href: '#', name: 'Overview' }, 
    { href: '#', name: 'Setup' }, 
    { href: '#', name: 'Usage' }, 
]; 


export default class Navigation extends React.Component<INavigationProps, {}> { 
    render() { 

     return (
      <Navbar> 
       <NavbarHeader href="homepage.html" name="Website Name"/> 
       <NavItem> 
        <MenuItem link="about.html" title="About" /> 
        <MenuItem link="contact.html" title="Contact" /> 
        <MenuItem link="services.html" title="Services" /> 
       </NavItem> 
      </Navbar> 
     ); 
    } 
} 

    // A '.tsx' file enables JSX support in the TypeScript compiler, 
// for more information see the following page on the TypeScript wiki: 
// https://github.com/Microsoft/TypeScript/wiki/JSX 
/// <reference path="./../../typings/index.d.ts" /> 

import * as React from "react"; 
import * as ReactDOM from "react-dom"; 
import * as ReactBootstrap from 'react-bootstrap'; 

import HeaderNavigation from "./NavigationComponent/navigation"; 
import Hello from "./HelloComponent/Hello"; 

ReactDOM.render(
    <div> 
     <HeaderNavigation /> 
     <Hello name="Athraya" /> 
    </div>, 
    document.getElementById("root") 
); 

Answer 1

あなたがあなたの反応-ブートストラップバージョン、またはブートストラップNAV施設と互換性のあるバージョンを反応させますか？ によるとthis、多分バージョンエラーが発生します。

または、あなたがThisをチェックしてリンクproperty.didを使用しているため、反応ルータをチェックしましたか？

Answer 2

ありがとうございました。それは、反応ルータを使用するリンクプロパティであることが判明しました。 React Bootstrapは反応ルータに依存せず、あなたが提供したリンクを通して読んだ後、反応ブートストラップのドキュメントを読んで私はそれを動作させることができました。私は、反応ブートストラップで提供されているサンプルコードを試してみました。ここ

は活字体

export default class Navigation extends React.Component<INavigationProps, {}> { 
render() { 

    return (
     <Navbar inverse> 
      <Navbar.Header> 
       <Navbar.Brand> 
        <a href="#">React-Bootstrap</a> 
       </Navbar.Brand> 
       <Navbar.Toggle /> 
      </Navbar.Header> 
      <Navbar.Collapse> 
       <Nav> 
        <NavItem eventKey={1} href="#">Link</NavItem> 
        <NavItem eventKey={2} href="#">Link</NavItem> 
        <NavDropdown eventKey={3} title="Dropdown" id="basic-nav-dropdown"> 
         <MenuItem eventKey={3.1}>Action</MenuItem> 
         <MenuItem eventKey={3.2}>Another action</MenuItem> 
         <MenuItem eventKey={3.3}>Something else here</MenuItem> 
         <MenuItem divider /> 
         <MenuItem eventKey={3.3}>Separated link</MenuItem> 
        </NavDropdown> 
       </Nav> 
       <Nav pullRight> 
        <NavItem eventKey={1} href="#">Link Right</NavItem> 
        <NavItem eventKey={2} href="#">Link Right</NavItem> 
       </Nav> 
      </Navbar.Collapse> 
     </Navbar> 

    ); 
}