Query

With status and handling

const usersStore = defineStore(({ query }) => {
  const usersRepo = new UsersRepo();

  const usersQuery = query<User[], Error>(usersRepo.getUsers, {
    isAutorun: true,
  });

  return {
    usersQuery,
    refetch: usersQuery.refetch,
  };
});

Result:

render: 0

Loading...

Error: null

isLoading: true

isError: false

isSuccess: false


With dynamic params

const searchStore = defineStore(({ query, reactive, effect }) => {
  const usersRepo = new UsersRepo();
  const search = reactive('');

  const userQuery = query<User | null, void, string>((name) =>
    usersRepo.getUserByName(name),
  );
  const debouncedRunQuery = debounce(
    (searchValue: string) => {
      userQuery.run(searchValue);
    },
    { waitMs: 300 },
  );

  effect(() => {
    const searchValue = search.get();

    if (searchValue) {
      debouncedRunQuery.call(searchValue);
    }
  });

  const onSearch = (value: string) => search.set(value);

  return {
    search,
    userQuery,
    onSearch,
  };
});

Result:

render: 0

User not found