Аполлон: Проблема запуска локальной мутации состояния через componentDidMount () - PullRequest
0 голосов
/ 26 ноября 2018

Так что я использую локальное состояние для переключения открытия / закрытия окна, что я делал с помощью события onClick.Но я запускаю эту функцию через componentDidMount (), которая не будет работать.

Мой код выглядит следующим образом:

Resolver:
    clientState: {
      resolvers: {
        Mutation: {
          toggleCart(_, variables, { cache }) {
            // read the cartOpen value from the cache
            const { cartOpen } = cache.readQuery({
              query: LOCAL_STATE_QUERY,
            });
            // Write the cart State to the opposite
            const data = {
              data: { cartOpen: !cartOpen },
            };
            cache.writeData(data);
            return data;
          },
        },
      },
      defaults: {
        cartOpen: false,
      },
    },

Queries:
const LOCAL_STATE_QUERY = gql`
  query {
    cartOpen @client
  }
`;

const TOGGLE_CART_MUTATION = gql`
  mutation {
    toggleCart @client
  }
`;

Components:
                    <Mutation mutation={TOGGLE_CART_MUTATION}>
                        {(toggleCart) => {
                            return (
                                <Mutation
                                mutation={UPDATE_ITEM_MUTATION}
                                variables={{
                                    id: this.props.itemid,
                                    quantity: itemDetails.quantity - this.props.quantity, 
                                }}
                                refetchQueries={[{ query: CURRENT_USER_QUERY }]}
                                >
                                {(updateItem, { loading, error }) => (
                                    <>
                                    <MutationOnMount mutation={toggleCart} />
                                    <MutationOnMount mutation={updateItem} />
                                    </>
                                    ) 
                                }
                                </Mutation>
                            );
                        }}
                    </Mutation>

class MutationOnMount extends React.Component {
    componentDidMount() {
      this.props.mutation(); // Run mutation on Mount
    }
  
    render() {
        return (
            null
        );
    }
  }

Как есть, запуск мутации с помощью componentDidMount () не дает желаемого результата, но если я заменю

<MutationOnMount mutation={toggleCart} />

 with 

<div><button type="button" id="toggleCartButton" disabled={loading} onClick={toggleCart} /></div>

тогда мутация работает нормально, когда я нажимаю кнопку.Есть идеи, почему он не работает через componentDidMount ()?

...