Javascript 流星1.3，反应，反应路由器-数据未通过

我正在尝试使用Meteor1.3，React和React路由器来运行一个非常基本的应用程序。页面正在呈现，但我在获取传递的数据时遇到问题。我已经做了一些研究，但无法找到这种特殊的组合，包括容器模式的使用

应用程序需要做的就是在测试页面上显示“Thingies”集合中的所有项目。不确定是数据发布、路由、容器还是其他错误

调试控制台行在集合中都显示0，即使mongo shell肯定会在集合中显示项

我的项目结构：

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);

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>
);

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>
)

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

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

export default App;

从'Meteor/Meteor'导入{Meteor}；
从“../../api/things.js”导入{Thingies}；
从“meteor/react meteor数据”导入{createContainer}；
从“React”导入React，{Component}；
类TestContainer扩展组件{
render（）{
log（'Props:'+this.Props.thingies.length）；
让RenderThings=this.props.thingies.map（thing=>{
return
{thing.text}
});
返回(
测试这个

{渲染}

);
}
}
TestContainer.propType={
thingies:React.PropTypes.array
};
导出默认createContainer（（）=>{
Meteor.subscribe（“thingies”）；
log（'Container:'+Thingies.find（{}.count（））；
返回{
thingies:thingies.find（{}）.fetch（），
};
}，测试容器）；

routes.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);

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>
);

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>
)

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

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

export default App;

从“React”导入React；
从“react Router”导入{Router，Route，IndexRoute，browserHistory}；
//路由组件
从“../ui/layouts/App.jsx”导入应用程序；
从“..//ui/pages/Test.jsx”导入TestContainer；
从“../ui/pages/Index.jsx”导入索引；
导出常量renderRoutes=（）=>(
);

Navigation.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);

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>
);

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>
)

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

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

export default App;

从“React”导入React；
从“react router”导入{IndexLink，Link}；
导出常量导航=（）=>(
航行

家
索引
试验

)

App.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);

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>
);

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>
)

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

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

export default App;

import React，{Component}来自'React'；
从“../components/Navigation.jsx”导入{Navigation}；
常量App=（{children}）=>(
{儿童}
)
导出默认应用程序；

---

非常感谢。我肯定我错过了一些明显的东西

我会尝试稍微更改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);

编辑：尝试将发布方法替换为：

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

---

我将尝试稍微更改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);

编辑：尝试将发布方法替换为：

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

---

谢谢，尝试了这个，发现订阅还没有准备好，但是它似乎从来没有准备好？？用一点额外的信息编辑了我的答案：谢谢，尝试了这个，发现订阅还没有准备好，但是它似乎从来没有准备好？？用一点额外的信息编辑了我的答案：