从订阅中反应Apollo第一个对象,而不是合并到它实际被删除的先前数据中

Question

我有一个查询,它给我一个笔记列表和一个订阅,它通过改变查询来监听和插入新笔记.但问题是第一个注释没有添加.

所以让我添加更多细节,最初是一个包含一个名为notes的属性的对象的查询响应,如果我们尝试添加一个注释,该属性将被删除.注释是创建的,所以如果我刷新我的应用程序,查询将返回注释然后如果我尝试再次添加注释,注释将添加到查询对象中的数组.

这是我的笔记容器,我查询笔记并创建一个新属性来订阅更多笔记.

export const NotesDataContainer = component => graphql(NotesQuery,{

name: 'notes',
props: props => {

  console.log(props); // props.notes.notes is undefined on first note added when none exists.

  return {
    ...props,
    subscribeToNewNotes: () => {

      return props.notes.subscribeToMore({
        document: NotesAddedSubscription,
        updateQuery: (prevRes, { subscriptionData }) => {

          if (!subscriptionData.data.noteAdded) return prevRes;

          return update(prevRes, {
            notes: { $unshift: [subscriptionData.data.noteAdded] }
          });

        },
      })
    }
  }
}

})(component);

任何帮助都会很棒,谢谢.

编辑:

export const NotesQuery = gql`
  query NotesQuery {
    notes {
      _id
      title
      desc
      shared
      favourited
    }
  }
`;

export const NotesAddedSubscription = gql`
  subscription onNoteAdded {
    noteAdded {
      _id
      title
      desc
    }
  }
`;

另一个编辑

class NotesPageUI extends Component {

  constructor(props) {

    super(props);

    this.newNotesSubscription = null;

  }

   componentWillMount() {

      if (!this.newNotesSubscription) {

      this.newNotesSubscription = this.props.subscribeToNewNotes();

      }

   }

   render() {

     return (
        <div>

          <NoteCreation onEnterRequest={this.props.createNote} />

            <NotesList
              notes={ this.props.notes.notes }
              deleteNoteRequest={    id => this.props.deleteNote(id) }
              favouriteNoteRequest={ this.props.favouriteNote }
            />

        </div>
     )
   }
 }

另一个编辑:

https://github.com/jakelacey2012/react-apollo-subscription-problem

Answer 1

是的，它开始工作了，只是通过网络发送的新数据需要与原始查询的形状相同。

例如

NotesQuery 有这样的形状......

query NotesQuery {
  notes {
    _id
    title
    desc
    shared
    favourited
  }
}

然而订阅中传来的数据却是这样的。

subscription onNoteAdded {
  noteAdded {
    _id
    title
    desc
  }
}

注意订阅查询中缺少shared& 。favourited如果我们添加它们，它现在就可以工作了。

这就是问题所在，react-apollo内部检测到差异，然后不添加数据，我想如果有更多反馈，这会很有用。

我将尝试与这些react-apollo人合作，看看我们是否可以将类似的东西落实到位。

https://github.com/apollographql/react-apollo/issues/649