import { useProvidedScope } from "effector-vue/composition";

Returns the Scope the component works in, or null when the application runs in global mode. Mostly needed for allSettled and scopeBind calls written by hand: the other composables resolve the scope on their own.

Designed for Vue 3 and Composition API exclusively.

Methods

useProvidedScope(options?)

Formulae

useProvidedScope(options?: { forceScope?: boolean }): Scope | null;
useProvidedScope(options: { forceScope: true }): Scope;

Arguments

1. options? { forceScope?: boolean }, forceScope throws instead of returning null

Returns

Scope | null, and Scope when forceScope: true is passed.

Examples

Prefetching data on the server

<script setup lang="ts">
import { onServerPrefetch } from "vue";
import { allSettled } from "effector";
import { useProvidedScope, useUnit } from "effector-vue/composition";

import { loadUserFx, $user } from "./model";

const scope = useProvidedScope({ forceScope: true });
const user = useUnit($user);

onServerPrefetch(() => allSettled(loadUserFx, { scope, params: 1 }));
</script>

<template>
  <p>{{ user.name }}</p>
</template>

Notes

The scope is resolved through the injection context, so call it in setup before the first await, or inside app.runWithContext. See EffectorScopePlugin for the full resolution order.