---
schema_version: "1"
id: 033c7bd0a10e607195a0b7e8b3b3eb4f49640a2d334c994e48ebb62e22b332ff
title: Update Cached Query Results
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/graphql-api/graphql/guides/wire/graphql-wire-lwc-refresh.md
canonical_url: https://developer.salesforce.com/docs/platform/graphql/guide/graphql-wire-lwc-refresh.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: 69d94dd45a9f5173d5cd9e209d0a5dda608f9933bf8bda25d2dfcf831e9b90a5
products:
  - GraphQL API
---
# Update Cached Query Results

The GraphQL wire adapter automatically caches your query results to improve the loading performance of subsequent queries. You can trigger a refresh of the query results and update the cache by calling the refresh method on the emitted data from the GraphQL wire adapter.

If you use a wire function, you can assign `data` and `errors` to a `result` variable like this.

```javascript
@wire(graphql, { query: ... })
graphqlQueryResults(result) {
  const { data, errors, refresh } = result;
}
```

## Implement Cache Refresh in LWC

**tip:** The [`graphqlRefresh` component](https://github.com/trailheadapps/lwc-recipes/tree/main/force-app/main/default/lwc/graphqlRefresh) in the [lwc-recipes repo](https://github.com/trailheadapps/lwc-recipes) demonstrates how to refresh a query using the refresh method.

Here's an example that adds a refresh button to the example in [Make Your Variables Reactive](https://developer.salesforce.com/docs/platform/graphql/guide/graphql-wire-lwc-reactive.md).

```javascript
//refreshAccountsGQL.js
import { LightningElement, wire } from "lwc";
import { gql, graphql } from "lightning/graphql";

export default class AccountsGQL extends LightningElement {
  records;
  errors;
  graphqlRefresh;

  minAmount = "5000000";

  minAmounts = [
    { label: "All", value: "0" },
    { label: "$5,000,000", value: "5000000" },
    { label: "$50,000,000", value: "50000000" },
    { label: "$500,000,000", value: "500000000" },
  ];

  @wire(graphql, {
    query: gql`
      query bigAccounts($minAmount: Currency) {
        uiapi {
          query {
            Account(where: { AnnualRevenue: { gte: $minAmount } }) {
              edges {
                node {
                  Id
                  Name {
                    value
                  }
                  AnnualRevenue {
                    displayValue
                  }
                }
              }
            }
          }
        }
      }
    `,
    variables: "$variables",
  })
  graphqlQueryResult({ data, errors, refresh }) {
    if (data) {
      this.records = data.uiapi.query.Account.edges.map((edge) => edge.node);
    }
    this.errors = errors;
    // Store the refresh method to call later
    this.graphqlRefresh = refresh;
  }

  async handleRefresh() {
    return this.graphqlRefresh();
  }

  get variables() {
    return {
      minAmount: this.minAmount,
    };
  }

  // Called when the user selects a new minimum amount
  handleMinAmountChange(event) {
    this.minAmount = event.detail.value;
  }
}
```

If a record that's contained in a query result changes, Lightning Data Service emits a new value to the GraphQL wire adapter.
However, Lightning Data Service doesn't reevaluate the query to see if the record still matches the query.

To ensure that Lightning Data Service reevaluates your query, use the refresh method. This example adds a button that enables you to trigger a refresh of the query results.

```html
<!-- refreshAccountsGQL.html -->
<template>
    <lightning-card title="accountsGQL" icon-name="standard:account">
        <lightning-button slot="actions" label="Refresh" title="Refresh"
            icon-name="utility:refresh" onclick={handleRefresh}
            class="slds-m-left_x-small">
        </lightning-button>
        <div class="slds-var-m-horizontal_medium">
            <lightning-combobox
                name="minAmount"
                label="Amount"
                value={minAmount}
                placeholder="Select a minimum amount"
                options={minAmounts}
                onchange={handleMinAmountChange} ></lightning-combobox>

        <template lwc:if={records}>
            <template for:each={records} for:item="account">
                    <div class="card-spacer" key={account.Id}>
                        <h1 slot="title">{account.Name.value}</h1>
                        {account.AnnualRevenue.displayValue}
                    </div>
            </template>
        </template>
    </div>
</template>
```