Как вы публикуете и подписываетесь на данные, которые не Mongo db? - PullRequest
Новая
       14

Как вы публикуете и подписываетесь на данные, которые не Mongo db?

0 голосов
/ 10 июня 2018

Каков процесс установки Meteor.publish, который выполняет некоторый асинхронный запрос (например, API), а затем возвращает данные, которые вы хотите отобразить в компоненте React?Как работает публикация и как к ней обращается код со стороны клиента?Я хочу сделать это с помощью функции withTracker, если это возможно.Спасибо!

1 Ответ

0 голосов
/ 10 июня 2018

Это руководство должно помочь: Публикации и загрузка данных .

По сути, вам необходимо понять, как работает низкоуровневый API Meteor , чтобы вы знали, какопубликуйте любой набор данных, который вы хотите, в коллекции Mongo на стороне клиента.Кроме того, для публикации данных из других конечных точек API, эта часть руководства демонстрирует довольно четкий пример.

Что касается подписки такого рода настраиваемой публикации на стороне клиента, то это так же простокак то, как вы подписываетесь на типичную публикацию типа MongoDB.Обратите внимание, что, как я уже говорил выше, разница заключается в том, что вы публикуете / подписываетесь на Клиентскую коллекцию .

Ниже приведен простой пример, который я написал сам.Я не знаю, что такое React, но код клиента в основном основан на руководствах Meteor: 

/* client side */
import React, { Component } from 'react';
import { withTracker } from 'meteor/react-meteor-data';
import { Meteor } from 'meteor/meteor'; 
import { Mongo } from 'meteor/mongo';

const Foo = new Mongo.Collection('Foo');

class App extends Component {
  renderFoo() {
    return this.props.foos.map((foo) => (
      <Foo key={foo._id} foo={foo} />
    ));
  }
}

export default withTracker(() => {
  Meteor.subscribe('publishFromAnApi', ...args);
  return {
    foos: Foo.find().fetch(),
  };
})(App);


/* server side */
import { Meteor } from 'meteor/meteor';
import { HTTP } from 'meteor/http';

Meteor.publish('publishFromAnApi', function publishFromAnApi(...args) {  // must use a function instead of an arrow function here for the sake of `this`
  const publishedKey = {};
  const collectionName = 'Foo'; // same name of the client side collection mentioned in line 6

  const poll = () => {
    const { data } = HTTP.get('/some/api/route', { ...someArgsToRequest });
    for (let i = 0; i < data.responseFromAPI; i += 1) { // just a random example here, assuming responseFromAPI is an array
      const document = data.responseFromAPI[i];
      const id = <the id of the document; normally is in Mongo.ObjectID type>;

      // some logics might be going on...

      if (!publishedKey[id]) {
        this.added(collectionName, id, document);
        publishedKey[id] = true;
      } else {
        this.changed(collectionName, id, document);
      }
    }
  };

  poll();
  this.ready();

  const interval = Meteor.setInterval(poll, <poll interval>);

  this.onStop(() => {
    Meteor.clearInterval(interval);
  });
});

...