当我们从 Mongo 控制台更新集合时，Meteor Apollo 没有更新 UI

Posted 2023-03-08

【中文标题】当我们从 Mongo 控制台更新集合时，Meteor Apollo 没有更新 UI

【英文标题】：Meteor Apollo not updating UI when we update collection from Mongo console

【发布时间】：2017-03-26 21:01:00

【问题描述】：

我开始使用流星阿波罗入门套件https://github.com/apollostack/meteor-starter-kit ，并且我创建了一个集合“帖子”，并且能够将数据拉入 UI。但是当我从 mongo 控制台更新集合时，它不会自动更新 UI ......我是否缺少一些配置？有人能帮我一下吗？

代码如下：

架构和解析器：

import Random from 'meteor/random';

const Posts = new Mongo.Collection('posts');
export const typeDefs = [`

  type Post 
    _id: String
    title: String
  


  type Query 
    myPosts: [Post]
  

  schema
    query: Query
  

`];

export const resolvers = 
    Query: 
        myPosts(root, args) 
            return Posts.find().fetch();
        

    ,
    Post: 
        title: (title) => title
    
;

应用组件：

import React, Component from 'react';
import graphql from 'react-apollo';
import Meteor from 'meteor/meteor';
import createContainer from 'meteor/react-meteor-data';
import gql from 'graphql-tag';

const App = (userId, loading, error, myPosts, refetch) => 
    return (
        <div>userId
            <button onClick=() => refetch()>Refetch!</button>
            myPosts && myPosts.map((post, index) => 
                return (
                    <div key=index>post.title</div>
                );
            )
        </div>
    );

;

App.propType = 
    userId: React.PropTypes.string.isRequired,
    posts: React.PropTypes.Object,
    refetch: React.PropTypes.func
;

const GET_USER_DATA = gql `
  
    myPosts
      title
    
  
`;

const withData = graphql(GET_USER_DATA, 
    props: (data) => 
        console.log(data);
        const loading, error, myPosts, variables, refetch = data;

        if (loading)
            return loading;
        if (error)
            return error;
        return myPosts, refetch;

    ,
    options: (ownProps) => (
        variables: 
            id: "myownvariable"
        
    )
);

const AppWithData = withData(App);

const AppWithUserId = createContainer(() => 
    return userId: "sampleuserid";
, AppWithData);

export default AppWithUserId;

客户端/main.js

import Meteor from 'meteor/meteor';
import render from 'react-dom';
import React from 'react';

import ApolloClient from 'apollo-client';
import meteorClientConfig from 'meteor/apollo';
import ApolloProvider from 'react-apollo';

import App from '/imports/ui/App';

const client = new ApolloClient(meteorClientConfig());

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

服务器/main.js

import createApolloServer from 'meteor/apollo';
import makeExecutableSchema, addMockFunctionsToSchema from 'graphql-tools';

import typeDefs, resolvers from '/imports/api/schema';

const schema = makeExecutableSchema(typeDefs, resolvers);

createApolloServer(schema);

【参考方案1】：

Apollo 与 Meteor pubsub 不同，默认情况下不会向客户端发送更新。您可以使用以下方法之一进行设置：

http://dev.apollodata.com/react/receiving-updates.html

【讨论】：

感谢您的回答。链接dev.apollodata.com/react/receiving-updates.html 帮助我解决了我的问题。

就我而言，轮询工作正常，但我无法弄清楚如何使用订阅。有流星阿波罗的任何工作示例吗？非常感谢您的帮助！

我还没做，但是你应该可以用这些函数的参数来配置你需要的一切：dev.apollodata.com/core/meteor.html#API