2016-12-19 5 views
0

から送られた子供たちのプロパティを読み取ることができません。私はルータを使用して、URLに基​​づいて適切な子供を送信しています。以下は私のindex.jsの構造です:私はreactjsに新しいです親

class Tj extends React.Component { 
render() { 
    return (
     <Router history={browserHistory}> 
      <Route path={"/"} component={Bridge} > 
       <IndexRoute component={Home} /> 
       <Route path={"user"} component={T} /> 
       <Route path={"home"} component={Home} /> 
      </Route> 
      <Route path={"home"} component={Home} /> 
     </Router> 
    ); 
} 
} 
render(
    <Provider store={store}> 
    <Tj/> 
</Provider>, 
window.document.getElementById('mainContainer')); 

これまでのところとても良いです。今、私はbridge.jsで子供を取得し、渡された子供のタイプに基づいてレンダリングのための出力を決定する必要があります。

import React from "react"; 
import {Header} from "../components/Header"; 
export class Bridge extends React.Component { 
render() { 
    var Content; 
    if(this.props.children.tag==="homeTag"){ 
    Content=<div> 
     <div className="row"> 
      <Header/> 
     </div> 
     <div className="row"> 
      {this.props.children} 
     </div> 
    </div>; 
     }else{ 
     some other code to render} 

    return (

     Content 

    ); 
} 
} 

問題はこの時点で正確に始まります。ここでは、Home.jsなどのindex.jsで送信した各要素で設定したプロパティをタグで確認しますが、コンポーネントのタグは設定されていませんが、定義されていません。以下はHome.jsです:

class Home extends React.Component { 
render() { 
    return (
     <div> 
       <MainComp tag="homeTag"/> 
      </div> 
    ); 
    } 
} 

あなたは、私はそれが定義されていない、それを読んしようとしたとき、私はHome.jsではなくbridhe.jsにタグを送信見ることができるように。誰も助けることができますか?

************* UPDATE ******************************** ********** 詳細な説明: 私は部品の種類が送信された区別できるようにするには、タグを使用しています。私がそれをタイプするといいかもしれません。そのため、bridge.jsではコンポーネントのタイプをチェックしています。たとえばホームコンポーネントであれば、ヘッダーも表示されます。

+0

私はドン」:

はまた
<Router history={browserHistory}> <Route path={"/"} component={Bridge} > <IndexRoute component={Home} /> <Route path={"user"} component={T} /> <Route path={"home"} component={Home} /> </Route> <Route path={"/"} component={Bridge2} > <IndexRoute component={Test1} /> </Route> <Route path={"home"} component={Home} /> </Router> 

詳細はこちらのリンクをご覧ください'タグ'が何であるか、あなたが設定する場所、またはそれを使う理由を理解する。説明していただけますか? – Chris

+0

@Chris実際には、送られてきたコンポーネントのタイプを区別できるタグを使用しています。私がそれをタイプするといいかもしれません。そのため、bridge.jsではコンポーネントのタイプをチェックしています。たとえばホームコンポーネントであれば、ヘッダーも表示されます。もっと明確にするために私が必要な場合はお知らせください –

答えて

0

同じ問題を抱えている人と共有する価値はありますが、これと私の解決方法が見つかりました。私は愚かな間違いをした。だからではなく、で異なるルートを定義することをお勧めしますテンプレートから送られた子をチェックするなど、別のテンプレート: related answer

関連する問題