Meteor 1.3、React、React Router - データが通過しない

Question

Meteor 1.3、React and React-Routerを使って非常に基本的なアプリケーションを開発しようとしています。ページはレンダリングされていますが、データの受け渡しに問題があります。私はいくつかの研究をしましたが、コンテナパターンの使用を含むこの特定の組み合わせではそれほど多くを見つけることができませんでした。

すべては、テストページの「Thingies」コレクションのすべてのアイテムを表示するだけです。それがデータのパブリケーション、ルーティング、コンテナなのか間違っているのかわからないのですか？

デバッグコンソールライン全てはモンゴシェルは間違いなくそこに項目を示していても、コレクションに0を示しています。私のプロジェクトの

構造：http://i.stack.imgur.com/WZXFa.png

things.js

import { Meteor } from 'meteor/meteor'; 
import { Mongo } from 'meteor/mongo'; 
import { check } from 'meteor/check'; 

export const Thingies = new Mongo.Collection('thingies'); 

if (Meteor.isServer) { 
    // This code only runs on the server 
    Meteor.publish('thingies', function thingiesPublication() { 
    return Thingies.find(); 
    }); 
} 

Test.jsx

import { Meteor } from 'meteor/meteor'; 
import { Thingies } from '../../api/things.js'; 
import { createContainer } from 'meteor/react-meteor-data'; 
import React, { Component } from 'react'; 

class TestContainer extends Component { 
    render(){ 

    console.log('Props: ' + this.props.thingies.length); 

    let RenderThings = this.props.thingies.map(thing => { 
     return <li key={thing._id}>{thing.text}</li> 
    }); 

    return (
     <div> 
     <h1>Test this</h1> 
     <ul> 
      { RenderThings } 
     </ul> 
     </div> 
    ); 
    } 
} 

TestContainer.propType = { 
    thingies: React.PropTypes.array 
}; 

export default createContainer(() => { 
    Meteor.subscribe('thingies'); 

    console.log('Container: ' + Thingies.find({}).count()); 

    return { 
    thingies: Thingies.find({}).fetch(), 
    }; 
}, TestContainer); 

が

をroutes.jsx

import React from 'react'; 
import { Router, Route, IndexRoute, browserHistory } from 'react-router'; 

// route components 
import App from '../../ui/layouts/App.jsx'; 
import TestContainer from '../../ui/pages/Test.jsx'; 
import Index from '../../ui/pages/Index.jsx'; 

export const renderRoutes =() => (
    <Router history={browserHistory}> 
    <Route path="/" component={ App }> 
     <IndexRoute component={ Index } /> 
     <Route path="index" component={Index}/> 
     <Route path="test" component={TestContainer}/> 
    </Route> 
    </Router> 
); 

Navigation.jsx

import React from 'react'; 
import { IndexLink, Link } from 'react-router'; 

export const Navigation =() => (
<div> 
<h4>Navigation</h4> 
    <ul> 
    <li><IndexLink to="/" activeClassName="active">Home</IndexLink></li> 
    <li><Link to="index" activeClassName="active">Index</Link></li> 
    <li><Link to="test" activeClassName="active">Test</Link></li> 
    </ul> 
    </div> 
) 

App.jsx

import React, { Component } from 'react'; 
import { Navigation } from '../components/Navigation.jsx'; 

const App = ({ children }) => (
    <div> 
    <Navigation /> 
    { children } 
    </div> 
) 

export default App; 

事前に感謝します。私は明らかな何かが欠けていると確信しています！

Answer 1

私はTest.jsxコンテナコードを少し変更してみます：

export default createContainer(() => { 

    if (Meteor.subscribe('thingies').ready()) { 

    console.log('Container: ' + Thingies.find({}).count()); 

    return { 
     thingies: Thingies.find({}).fetch() 
    }; 
    } else { 
    return { 
     thingies: null 
    }; 
    } 
}, TestContainer); 

EDIT：で、あなたの公開方法を交換してみてください。

if (Meteor.isServer) { 
    // This code only runs on the server 
    Meteor.publish('thingies', function() { 
    return Thingies.find({}); 
    }); 
}