#Context (Контекст)

В NocoBase контекст (Context) — это мост, связывающий код плагина с возможностями NocoBase. Через контекст Вы можете отправлять запросы, выполнять интернационализацию, писать логи, навигировать между страницами и т.д.

У контекста есть две точки доступа:

• В Plugin: this.context
• В React-компонентах: useFlowContext() (импортируется из @nocobase/flow-engine)

Оба возвращают один и тот же объект (экземпляр FlowEngineContext), различаются только сценарии использования.

#Использование в Plugin

В методах жизненного цикла плагина, таких как load(), доступ к контексту осуществляется через this.context:

import { Plugin } from '@nocobase/client-v2';

class MyPlugin extends Plugin {
  async load() {
    // 通过 this.context 访问上下文能力
    const { api, logger } = this.context;

    const response = await api.request({ url: 'app:getInfo' });
    logger.info('应用信息', response.data);

    // 国际化：this.t() 会自动注入插件包名作为 namespace
    console.log(this.t('Hello'));
  }
}

#Использование в компонентах

В React-компонентах через useFlowContext() получают тот же объект контекста:

import { useFlowContext } from '@nocobase/flow-engine';

export default function MyPage() {
  const ctx = useFlowContext();

  const handleClick = async () => {
    const response = await ctx.api.request({ url: 'users:list', method: 'get' });
    console.log(response.data);
  };

  return <button onClick={handleClick}>{ctx.t('Load data')}</button>;
}

#Сокращённые свойства Plugin vs свойства ctx

Класс Plugin предоставляет ряд сокращённых свойств для удобного использования в load(). Однако обратите внимание: некоторые сокращённые свойства класса Plugin и одноимённые свойства на ctx указывают на разные вещи:

Самые путающиеся — this.router и ctx.router:

• this.router (сокращённое свойство Plugin) → RouterManager, используется для регистрации маршрутов (.add())
• ctx.router (свойство контекста) → экземпляр React Router, используется для навигации между страницами (.navigate())

// Plugin 里：注册路由
async load() {
  this.router.add('hello', {
    path: '/hello',
    componentLoader: () => import('./pages/HelloPage'),
  });
}

// 组件里：页面导航
const ctx = useFlowContext();
ctx.router.navigate('/hello'); // -> /v/hello

#Распространённые возможности, предоставляемые контекстом

Здесь перечислены распространённые возможности контекста. При этом некоторые доступны только в Plugin, другие — только в компонентах, третьи — в обоих местах, но с разным синтаксисом.

Подробное использование и примеры кода для каждой возможности см. в Распространённые возможности.

#Связанные ссылки

• Распространённые возможности — подробное использование ctx.api, ctx.t, ctx.logger и т.д.
• Plugin (Плагин) — точка входа плагина и сокращённые свойства
• Разработка Component-компонентов — базовое использование useFlowContext в компонентах