Javascript 如何使用React在Meteor应用程序中加载数据？

简介：

我是meteor的新手，我已经阅读了关于这个问题的文档和问题，但是疑问仍然存在我的主要问题是我无法在客户端加载MongoDb的数据（使用什么方法加载数据）

示例：

我有一个具有以下文件夹结构的项目：

在我的收藏（People.js）中，我有：

import { Mongo } from 'meteor/mongo';

export const People = new Mongo.Collection('people');

在服务器文件夹（main.js）中PS:我无法更改此文件

import { People } from '../collections/people';

Meteor.startup(() => {

const TEST_DATA = [
  {
    something: 'This is a simple example',
  }, ... ]

TEST_DATA.forEach(test => People.insert(test));

}

在UI文件夹（app.jsx）中

import React，{Component}来自'React'；
从“流星/反应流星数据”导入{withTracker}；
从“流星/流星”导入{Meteor}；
从“../collections/People”导入{People}；
导出类应用程序扩展组件{
render（）{
返回(
睾丸
{console.log（this.users）}
{console.log（People.find（{}.fetch（））}
{console.log（Meteor.subscribe（'people'））}
);
}
}
使用跟踪器导出默认值（（）=>{
返回{
用户：People.find（{}）.fetch（），
};
})（App）；

客户文件夹（main.jsx）：

从“React”导入React；
从“流星/流星”导入{Meteor}；
从'react dom'导入{render}；
从“../ui/App”导入{App}；
流星启动（（）=>{
render（，document.getElementById（'app'））；
});

调试：

我检查了数据库并填充了它。第一个console.log显示未定义的，第二个是长度为0的数组，第三个是对象

{stop:ƒ，ready:ƒ，subscriptionId:“mJQHdGxka4xTCX7FZ”}

（我想它返回这个是因为我没有在服务器上使用publish（）来填充数据库）

---

我应该使用什么方法来获取这些数据？

将

app.jsx

更改为

import React, { Component } from 'react';
import { withTracker } from 'meteor/react-meteor-data';
import { Meteor } from 'meteor/meteor';
import {People} from '../collections/people';

export class App extends Component {
  render() {
    console.log(this.props.users)
    return (
      <div>
        <h3>Teste </h3>
        { this.props.users.map((user) => { return (<div>user.something</div>) }) }
      </div>
    );
  }
}

export default withTracker(() => {
  Meteor.subscribe('people');
  return {
    users: People.find({}).fetch(),
  };
})(App);

在您的服务器代码中

import React from 'react';
import { Meteor } from 'meteor/meteor';
import { render } from 'react-dom';
import { App } from '../ui/App';

Meteor.startup(() => {
  render(<App />, document.getElementById('app'));
});

import React, { Component } from 'react';
import { withTracker } from 'meteor/react-meteor-data';
import { Meteor } from 'meteor/meteor';
import {People} from '../collections/people';

export class App extends Component {
  render() {
    console.log(this.props.users)
    return (
      <div>
        <h3>Teste </h3>
        { this.props.users.map((user) => { return (<div>user.something</div>) }) }
      </div>
    );
  }
}

export default withTracker(() => {
  Meteor.subscribe('people');
  return {
    users: People.find({}).fetch(),
  };
})(App);