Javascript 如何在vue模板脚本中有条件地调用apollo客户端？

我在模板文件中的脚本标记中将查询传递给apollo客户端，但我不想每次都这样做。相反，我希望在prop中传递一个布尔值，然后基于该布尔值运行查询（或不运行）

<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>

...
进口{
我的疑问
}来自“util/querys”；
道具：{
productId:{
类型：字符串，
默认值：“”，
},
suppressGraphQlQuery：{
类型：布尔型，
默认值：false，
}
},
数据（）{
返回{
相关产品：[]，
加载：0，
预加载：正确，
};
},
阿波罗：{
相关产品：{
查询：我的查询，
变量（）{
返回{
id:this.productId，
};
},
},
},

我希望能够利用suppressGraphQlQuery prop不调用apollo客户端，但不确定如何执行。当my prop==true时是否可以不运行查询？ 提前谢谢。

您可以这样查询：

导出默认值{
道具：{
skipQuery：{
类型：布尔型，
默认值：false，
},
},
阿波罗：{
相关产品：{
查询：我的查询，
变量（）{
返回{
id:this.productId，
};
},
跳过（）{
返回此。skipQuery；
},
},
},
};