React Starter KitとReact Router Bootstrapの統合

Question

私はReactJSの世界で少し新しくなっていますが、今はJavascriptでしばらくコーディングしています。 Design PatternsとOOPを使う前にReactJSが私が純粋なJSでコーディングしていたときに気に入っていたことは、これを私にとって大きなアップグレードと考えています。

私はreact-starter-kit from kriasoftを使い始めました。 また、このプロジェクトにreact-bootstrapを統合して、私の人生を少し楽にしました。 私はreact-bootstrapからチュートリアルに続き、私は正常にブートストラップを追加しました。

問題は今、私がシンプルさと "力"のために好きだった反応スターターキットの<Link />でビルドを使うことができないということです。 react-bootstrapから

公式アプローチはreact-router-bootstrapをインストールし、<LinkContainer to="/path">と<Link to="/path">を交換することであるが、それは私が反応するルータと反応し、ルーティングおよびユニバーサルルートを交換する必要があることを意味し、これは私が避けたいものです。

react-bootstrapとreact-starter-kitを統合してもユニバーサルルーティングを使用できる正しい方法は何ですか？ LinkContainerがLinkコンポーネントとして動作するようにするには、どのような変更を行う必要がありますか？

react-starter-kitからリンクコンポーネントを使用すると、この種のエラーが発生する 警告：validateDOMNesting（...）：の後継者としては使用できません。ヘッダー> NavItem> SafeAnchor> a> ...>リンク> aを参照してください。 この問題の関連リンク。 （React-Bootstrap link item in a navitem）

react-bootstrapとreact-routerの公式の推奨事項です。 （https://github.com/ReactTraining/react-router/issues/83#issuecomment-214794477）

私が言ったように私は少し反応して、私は何かが欠けている可能性があります。 Link component from react-starter-kit とLink from react-routerの違いを誰かが明確にすることができたらうれしいです。事前

Answer 1

で おかげで、私は代わりに、元の自分NavItemのコンポーネントを使用して起動します。

import React, { PropTypes } from 'react'; 
import cx from 'classnames'; 
import Link from '../Link'; 

class NavItem extends React.Component { 
    static propTypes = { 
    className: PropTypes.string, 
    href: PropTypes.string.isRequired, 
    active: PropTypes.bool, 
    disabled: PropTypes.bool, 
    children: PropTypes.node.isRequired, 
    onClick: PropTypes.func, 
    }; 

    static defaultProps = { 
    active: false, 
    disabled: false, 
    }; 

    render() { 
    const { className, href, active, disabled, children, onClick } = this.props; 
    return (
     <li role="presentation" className={cx(className, { active, disabled })}> 
     <Link to={href} onClick={onClick}> 
      {children} 
     </Link> 
     </li> 
    ); 
    } 
} 

export default NavItem; 

は、これは私が今のthis postのおかげに従ったアプローチです。