#ctx.view

当前激活的视图控制器（弹窗、抽屉、气泡层、嵌入式区域等），用于访问视图级信息和操作。由 FlowViewContext 提供，仅在通过 ctx.viewer 或 ctx.openView 打开的视图内容中可用。

#适用场景

注意：ctx.view 仅在有视图上下文的 RunJS 环境中可用（如 ctx.viewer.dialog() 的 content 内、弹窗表单、关联选择器内部）；在普通页面或后端上下文中为 undefined，使用时建议做可选链判断（ctx.view?.close?.()）。

#类型定义

type FlowView = {
  type: 'drawer' | 'popover' | 'dialog' | 'embed';
  inputArgs: Record<string, any>;
  Header: React.FC<{ title?: React.ReactNode; extra?: React.ReactNode }> | null;
  Footer: React.FC<{ children?: React.ReactNode }> | null;
  close: (result?: any, force?: boolean) => void;
  update: (newConfig: any) => void;
  navigation?: ViewNavigation;
  destroy?: () => void;
  submit?: () => Promise<any>;  // 流配置视图中可用
};

#常用属性和方法

目前仅 dialog 和 drawer 支持 Header 和 Footer。

#inputArgs 常见字段

不同打开场景下 inputArgs 字段不同，常见包括：

通过 ctx.getVar('ctx.view.inputArgs.xxx') 或 ctx.view.inputArgs.xxx 访问。

#示例

#关闭当前视图

// 提交成功后关闭弹窗
await ctx.resource.runAction('create', { data: formData });
ctx.view?.close();

// 关闭并回传结果
ctx.view?.close({ id: newRecord.id, name: newRecord.name });

#在 content 中使用 Header / Footer

function DialogContent() {
  const ctx = useFlowViewContext();
  const { Header, Footer, close } = ctx.view;
  return (
    <div>
      <Header title="编辑" extra={<Button size="small">帮助</Button>} />
      <div>表单内容...</div>
      <Footer>
        <Button onClick={() => close()}>取消</Button>
        <Button type="primary" onClick={handleSubmit}>确定</Button>
      </Footer>
    </div>
  );
}

#根据视图类型或 inputArgs 做分支

if (ctx.view?.type === 'embed') {
  // 嵌入式视图中隐藏头部
  ctx.model.setProps('headerStyle', { display: 'none' });
}

const collectionName = ctx.view?.inputArgs?.collectionName;
if (collectionName === 'users') {
  // 用户选择器场景
}

#与 ctx.viewer、ctx.openView 的关系

ctx.viewer 负责「打开」视图，ctx.view 表示「当前」所在视图实例；ctx.openView 用于打开已配置的流程视图。

#注意事项

• ctx.view 仅在视图内部可用，普通页面中为 undefined
• 使用可选链：ctx.view?.close?.() 避免在无视图上下文时报错
• close(result) 的 result 会传递给 ctx.viewer.open() 返回的 Promise

#相关

• ctx.openView()：打开已配置的流程视图
• ctx.modal：轻量级弹窗（信息、确认等）

ctx.viewer 提供 dialog()、drawer()、popover()、embed() 等方法打开视图，其打开的 content 内可访问 ctx.view。