【问题标题】:Relay Modern - Subscription updater(connection handler) method (no documentation on this matter)Relay Modern - 订阅更新程序(连接处理程序)方法(没有关于此问题的文档)
【发布时间】:2018-04-12 19:32:49
【问题描述】:

我正在尝试订阅我的查询。所以我怀疑连接(来自 ConnectionHandler)不起作用。我找不到任何合适的文档。

我的订阅如下:

  const LinkSubscription = graphql`
  subscription LinkSubscription {
    Link(filter:{
      mutation_in:[CREATED]
    }){
      node{
        id
      }
    }
  }
`;

export default () => {
  const subscriptionConfig = {
    subscription: LinkSubscription,
    variables: {},
    onCompleted: () => { alert('done!'); },
    updater: (Store, data) => {
      const newLink = Store.getRootField('Link').getLinkedRecord('node');
      const allLinks = Store.getRoot();
      const edge = ConnectionHandler.createEdge(Store, allLinks, newLink, 'allLinks');
      const userId = localStorage.getItem('user_id');
      const connection = ConnectionHandler.getConnection(allLinks, newLink, 'allLinks');
      if (connection) {
        ConnectionHandler.insertEdgeAfter(connection, newLink);
        console.log('DONE');
      }
      console.log('DEBUG', Store);
      console.log('DEBUG2', newLink);
      console.log('DEBUG3', allLinks);
      console.log('DEBUG4', edge);
      console.log('DEBUG5', connection);
      console.log('DEBUG6', ConnectionHandler);
      console.log('DEBUG7', userId);
      console.log('Debug8', data);
    },
    onError: error => console.log('An error occured:', error),
  };
  requestSubscription(Environment, subscriptionConfig);
};

正如您在代码中看到的那样,我运行了很多日志来查看我做错了什么。

日志调试触发:RelayRecordSourceSelectorProxy

Log DEBUG2 触发:RelayRecordProxy // 针对特定 id(59f88d417fae441eb567c453) 已创建,

Log DEBUG3 触发:RelayRecordProxy// 客户端:root,

Log DEBUG4 触发:RelayRecordProxy// 客户端:root:59f88d417fae441eb567c453,

记录 DEBUG5:undefined

记录 DEBUG6:ConnectionHandler 方法,

记录 DEBUG7:user.id 请求查询的人。

问题1:您能否提供一些连接建议?

【问题讨论】:

    标签: reactjs graphql graphql-js relaymodern


    【解决方案1】:

    订阅:Updating the client on each response

    const LinkSubscription = graphql`
      subscription LinkSubscription {
        Link(filter: { mutation_in: [CREATED] }) {
          node {
            id
          }
        }
      }
    `;
    
    export const test = () => {
      const subscriptionConfig = {
        subscription: LinkSubscription,
        variables: {},
        onCompleted: () => {
          alert('done!');
        },
        updater: (Store, data) => {
          const newLink = Store.getRootField('Link').getLinkedRecord('node');
          const viewerProxy = Store.getRoot().getLinkedRecord('viewer');
    
          const connection = ConnectionHandler.getConnection(
            viewerProxy,
            '<nameConnection>', // 'Viewer_links' or <Name_links>
            { mutation_in: ['CREATED'] }
          );
          const edge = ConnectionHandler.createEdge(
            Store,
            connection,
            newLink,
            'LinkEdge'
          );
          if (connection) {
            ConnectionHandler.insertEdgeBefore(connection, edge);
            console.log('DONE');
          }
        },
        onError: error => console.log('An error occured:', error)
      };
    
      requestSubscription(Environment, subscriptionConfig);
    };
    

    【讨论】:

    • 我已阅读建议的文档。没有关于connectionHandler 的信息。认为这是一个测试订阅,我将进一步为我的应用程序生成真正的模式。上述问题仍然有效。第二个/第三个问题 2:Relay Modern 订阅是否可以在没有边缘/查看器的情况下工作?问题3:任何人都可以在connectionHandler.getConnection 上保留一个console.log 吗?
    猜你喜欢
    • 2017-11-26
    • 2019-09-07
    • 2018-02-14
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多