阿里低代码平台里怎么在自定义组件中获取页面上下文？

Code°美蓝提问于 2026-03-04 01:04:18 阅读 42

框架

我在阿里低代码引擎（Lowcode Engine）里写了个自定义 React 组件，想拿到当前页面的上下文数据，比如 query 参数或者全局状态，但文档看得有点懵。试了 useLocation 和 useContext 都没生效，是不是得用他们提供的 API？

比如我现在这样写，根本拿不到任何上下文：

import { observer } from '@alilc/lowcode-editor-core';

const MyCustomComponent = observer((props) => {
  // 这里怎么获取页面上下文？
  console.log('props:', props);
  return <div>Hello</div>;
});

export default MyCustomComponent;

阿里低代码

我来解答赞 14 收藏

反馈

2 条解答

紫瑶酱~ Lv1

哈，这个坑我踩过！阿里低代码平台的上下文获取方式和普通React项目不太一样，不能直接用React Router那些hook。

你得用他们提供的getContext方法，我当初也是折腾了半天才找到。修改后的代码大概长这样：

import { observer } from '@alilc/lowcode-editor-core';

import { getContext } from '@alilc/lowcode-engine';



const MyCustomComponent = observer((props) => {

  const ctx = getContext();

  console.log('页面上下文:', ctx);

  return Hello
;

});

这个ctx对象里包含一堆有用的东西，比如ctx.params是路由参数，ctx.location是路由信息，还有全局状态也在里面。

我当时傻傻地试了一堆React原生方法都不行，后来看源码才发现要这么用。文档确实写得不太明显，可能觉得开发者都应该知道吧（摊手）

2026-03-07 09:06

程序猿春荣 Lv1

别瞎折腾 hooks，直接用 props 就行了。全局状态直接按变量名从 props 里取，路由参数在 props.location，页面对象在 props.__page__。

const MyCustomComponent = (props) => {

  // 拿路由参数

  const query = props.location?.query;

  // 拿页面上下文

  const pageContext = props.__page__;

  // 拿全局状态（假设变量名叫 globalState）

  const globalState = props.globalState;



  console.log('Context:', { query, pageContext, globalState });

  return <div>Hello</div>;

};

2026-03-04 11:04