如何处理react-apollo中的删除操作 [英] How do I handle deletes in react-apollo

问题描述

我有一个类似的突变

mutation deleteRecord($id: ID) {
    deleteRecord(id: $id) {
        id
    }
}

和另一个location我有一个元素列表。

and in another location I have a list of elements.

我可以从服务器返回更好的东西，我该如何更新列表？

Is there something better I could return from the server, and how should I update the list?

更多一般来说，在apollo / graphql中处理删除的最佳做法是什么？

More generally, what is best practice for handling deletes in apollo/graphql?

推荐答案

我不确定这是的好习惯样式但这是我如何使用updateQueries处理react-apollo中项目的删除：

I am not sure it is good practise style but here is how I handle the deletion of an item in react-apollo with updateQueries:

import { graphql, compose } from 'react-apollo';
import gql from 'graphql-tag';
import update from 'react-addons-update';
import _ from 'underscore';


const SceneCollectionsQuery = gql `
query SceneCollections {
  myScenes: selectedScenes (excludeOwner: false, first: 24) {
    edges {
      node {
        ...SceneCollectionScene
      }
    }
  }
}`;


const DeleteSceneMutation = gql `
mutation DeleteScene($sceneId: String!) {
  deleteScene(sceneId: $sceneId) {
    ok
    scene {
      id
      active
    }
  }
}`;

const SceneModifierWithStateAndData = compose(
  ...,
  graphql(DeleteSceneMutation, {
    props: ({ mutate }) => ({
      deleteScene: (sceneId) => mutate({
        variables: { sceneId },
        updateQueries: {
          SceneCollections: (prev, { mutationResult }) => {
            const myScenesList = prev.myScenes.edges.map((item) => item.node);
            const deleteIndex = _.findIndex(myScenesList, (item) => item.id === sceneId);
            if (deleteIndex < 0) {
              return prev;
            }
            return update(prev, {
              myScenes: {
                edges: {
                  $splice: [[deleteIndex, 1]]
                }
              }
            });
          }
        }
      })
    })
  })
)(SceneModifierWithState);

这篇关于如何处理react-apollo中的删除操作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！