Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

disable calculate variables from reactive function if request is disabled #1243

Closed
ariran5 opened this issue Aug 18, 2021 · 7 comments
Closed

Comments

@ariran5
Copy link

ariran5 commented Aug 18, 2021

Is your feature request related to a problem? Please describe.
I use data from previous request and if i use reactive function, then i have error because my result is empty

() => ({
  myVariable: data.value.gqlResponse.id // error, data.value === undefined
})

i can use (?.) operator, but then my TS interface show me message "variables type error"

Its a good experience for the safety of variables

useQuery(
  querystring,
  () => ({ myVariable: data.value.fromResponse.id })
  () => ({ enabled: data.value }) // has response
)

Describe the solution you'd like
Calculate reactive function only if enabled option is true

Describe alternatives you've considered

Additional context

@yusufkandemir
Copy link

I am having the same problem. To work around the problem, I am using the optional chaining (?.) operator to avoid runtime errors and using @ts-expect to suppress TS errors.

const { result } = useGetCommitsByBranchQuery(
  // @ts-expect-error https://github.com/vuejs/apollo/issues/1243
  () => ({
    branchId: activeBranch.value?.id,
  }),
  () => ({
    enabled: activeBranch.value !== undefined,
  }),
);

@thomasaull
Copy link

Yeah I just ran into the same problem, is there any other solution from using // @ts-expect-error?

@ThomasReuss
Copy link

The above solution doesn't work for me - even if we ignore TypeScript.
It still makes unnecessary queries to the backend because enabled=false is too slow to avoid an unnecessary useQuery result evaluation with invalid query variables.

In other words: Assuming that myobject.value?.id can be undefined (e.g. if a user selects no object from a list, myobject is null) but the GQL query does not accept null or undefined IDs by GQL schema, how can we do something like:

if object.value?.id is a valid string ID:
  update the GQL result via useQuery
else:
  set the result to null

The above solutions seems not to work and I can only make it work in a very ugly way with load, useLazyQueryand nextTick.

@ThomasReuss
Copy link

ThomasReuss commented Mar 11, 2023

This has now been partially resolved with a recent Release, probably v4.0.0-beta.1.
For some cases, this still does not work:

useQuery(
  querystring,
  () => ({ myVariable: data.value.id })
  () => ({ enabled: !!data.value.id })
)

and will still execute the query when data.value.id is null.

@ThomasReuss
Copy link

This seems to work now on the initial execution of the query (whereas before v4.0.0-beta.1 it did not, but as soon as data.value.id is set from null to a variable like 5, the query still gets executed with data.value.id = null, and then again with data.value.id = 5.

@Akryum Akryum closed this as completed in d1d8426 May 16, 2023
@Akryum
Copy link
Member

Akryum commented May 16, 2023

@yusufkandemir in your code, if you use strict mode (and you should), TypeScript should compain if you don't put the optional chaining operator in the variables function, since activeBranch.value can be undefined.

@yusufkandemir
Copy link

@Akryum I am already using strict mode, thanks. Semantically I prefer activeBranch.value!.id since I know it is supposed to be defined there. But, it was failing due to this bug, which just got addressed, thanks for fixing this 👏

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants