I have a scenario where I pass a query to the apollo client in my template file using a script tag. However, I want to find a more efficient way to handle this without having to specify the query every time. My idea is to pass a boolean value through a prop and then decide whether to run the query based on that boolean.
<template>
...
</template>
<script>
import {
MY_QUERY
} from 'util/queries';
props: {
productId: {
type: String,
default: '',
},
suppressGraphQlQuery: {
type: boolean,
default: false,
}
},
data() {
return {
relatedProducts: [],
loading: 0,
preloading: true,
};
},
apollo: {
relatedProducts: {
query: MY_QUERY,
variables() {
return {
id: this.productId,
};
},
},
},
</script>
I am trying to figure out how to use the suppressGraphQlQuery prop to prevent the call to the apollo client when it is set to true. Can anyone provide guidance on how to achieve this? Thank you for any help!