2

我正在尝试编写一个 React 组件，它通过将集合名称作为道具传递来订阅服务器上的数据。（在示例中，名称仍然被硬编码以保持简单）由于集合名称可以动态更改，我正在调用一个方法来构造发布和服务器集合变量。现在的理论是在父组件中构造数据发布、服务器和客户端mongo集合变量，并在子组件中订阅该发布。父组件是这样设置的：

    export default class TilesSingle extends TrackerReact(Component) {
      newDataCollection(){
        Meteor.call("setupData","randomcollectionname");
        if(!window["randomcollectionname"]){
          window["randomcollectionname"] = new Meteor.Collection("randomcollectionname");
        }
      }
      render(){
        this.newDataCollection();
        return(
          <div>
            <DataObject />
          </div>
        )
      }
    }

setupData 方法如下所示：

Meteor.methods({
    setupData(collectionname){
      if(!global[collectionname]){
        global[collectionname] = new Meteor.Collection(collectionname);
        Meteor.publish("pub."+ collectionname,function() {
          return global[collectionname].find();
        });
      }
    }
})

子 DataObject 组件如下所示：

    export default class DataObject extends TrackerReact(Component) {
      constructor(){
        super();
        this.state = {
          subscription: {
            tiledata: Meteor.subscribe("pub.randomcollectionname"),
          }
        }
      }
      componentWillUnmount(){
        this.state.subscription.tiledata.stop();
      }
      findData(){
        post = window['randomcollectionname'].findOne();
        console.log(post)
        return post;
      }
      render(){
        obj = this.findData();
        if(!obj){
          obj = {};
          obj["score"] = 0;
        }
        return(
          <div>
            <h4>{obj.score}</h4>
          </div>
        )
      }
    }

请注意，我正在 findData() 函数中记录帖子。当我刷新时，控制台记录：

undefined
undefined
> Object {..}
> Object {..}
undefined
undefined

就好像订阅工作然后停止工作一样。我认为这与反应呈现这些组件的顺序有关，并且当客户端尝试呈现子组件时，该方法尚未在服务器上完成。有任何想法吗？

4

0 回答 0