页面跳转

在页面之间打开、返回。JSON 的 action 和 Page({}) 里的 this.navigate 是同一套名字。底栏切 Tab 用 switchTab，在 配置 里写 bottomMenus。在当前页里复用一块 UI，见 自定义组件。

组件 action 描述轻触后做什么。与 onTap 同时存在时，先调用 JS 再执行 action。字段见 组件。

动作类型

type / 方法	说明	主要字段
navigate	打开另一页面	page、params
redirect	关掉当前二级页再打开	page、params
switchTab	切到底栏某一项	page 或 index
back	关闭当前二级页	无
toast	弹出提示	text，可选 duration
save	弹出提示（仅 JSON）	toast（可选，默认「已保存」）
openUrl	用系统浏览器打开	url

action 中的字符串会做 {{path}} 替换。JS 里可写 this.navigate('detail')，字符串会当作 page / text / url。

navigate

{
  "type": "button",
  "text": "打开详情",
  "action": {
    "type": "navigate",
    "page": "detail",
    "params": {
      "id": "{{item.id}}",
      "from": "stats"
    }
  }
}

this.navigate({ page: 'detail', params: { id: 1 } });
this.navigate('detail');

• page：目标页文件夹（如 pages/detail）或入口中注册的 id
• params：带到目标页，模板用 {{params.id}}，onLoad(params) 也可读取

每次 navigate 打开新页面。底部 Tab 根页上的 back 不会退出应用。

redirect / switchTab / back

this.redirect({ page: 'detail', params: { id: 2 } });
this.switchTab('home');
this.switchTab({ page: 'pages/home' });
this.back();

JSON 同样写 "type": "redirect" / "switchTab" / "back"。

• redirect：先打开目标页，再关掉当前二级页。从底栏根页调用时等同 navigate，不会退出应用。
• switchTab：只切 bottomMenus 里的项。切走的 Tab 只 onHide，数据和滚动保留；再点回来只 onShow。当前若在二级页，会先关掉二级页。
• back：只 finish 二级页（PageActivity）。

{
  "title": {
    "text": "统计",
    "fontSize": 18,
    "color": "#FFFFFF",
    "background": "#006A65"
  },
  "style": {
    "background": "#F5F5F5"
  },
  "body": [
    {
      "type": "notice",
      "text": "点卡片走 JSON action。下面按钮走 this.navigate / toast / switchTab。"
    },
    {
      "type": "row",
      "style": {
        "gap": 8
      },
      "children": [
        {
          "type": "button",
          "text": "JS 打开",
          "onTap": "openDetail"
        },
        {
          "type": "button",
          "text": "替换打开",
          "onTap": "openMid"
        },
        {
          "type": "button",
          "text": "提示",
          "onTap": "sayHi"
        }
      ]
    },
    {
      "type": "space",
      "height": 8
    },
    {
      "type": "list",
      "bind": "stats",
      "item": {
        "type": "card",
        "action": {
          "type": "navigate",
          "page": "detail",
          "params": {
            "id": "{{item.id}}"
          }
        },
        "children": [
          {
            "type": "row",
            "style": {
              "gap": 10
            },
            "children": [
              {
                "type": "image",
                "src": "{{item.icon}}",
                "style": {
                  "width": 36,
                  "height": 36,
                  "radius": 8
                }
              },
              {
                "type": "column",
                "style": {
                  "weight": 1,
                  "gap": 4
                },
                "children": [
                  {
                    "type": "text",
                    "text": "{{item.title}}",
                    "style": {
                      "fontWeight": "bold"
                    }
                  },
                  {
                    "type": "notice",
                    "text": "{{item.time}}"
                  }
                ]
              },
              {
                "type": "tag",
                "text": "{{item.status}}",
                "style": {
                  "background": "#E6F4F1",
                  "color": "#006A65"
                }
              }
            ]
          }
        ]
      }
    }
  ]
}

UI

9:41100%

统计

点卡片走 JSON action。下面按钮走 this.navigate / toast / switchTab。

今日关注 12 人

10:21

完成

今日点赞 36 次

11:08

进行中

今日评论 8 条

14:02

完成

今日收藏 5 个

15:40

等待

底部菜单

在 配置 中设置。每一项的 page 指向一个页面。未配置则无底栏，启动后显示 homePage。页面里改角标、隐藏某一项、改颜色，见 底部菜单。

toast / openUrl

this.toast('已保存');
this.toast({ text: '已保存', duration: 'long' });
this.openUrl('https://deeke.cn');

{ "type": "button", "text": "返回", "action": { "type": "back" } }

{ "type": "button", "text": "保存设置", "onTap": "onSave", "action": { "type": "save", "toast": "已保存" } }

{ "type": "button", "text": "官网", "action": { "type": "openUrl", "url": "https://deeke.cn" } }

标题、滚动、弹层、加载圈见 页面事件。确认框用全局 Dialogs，不要再包一层 showModal。

自动化脚本不要写在 action 里。在 onTap 等方法中调用 Engines.executeScript，路径相对项目根目录，见 执行脚本。公共代码用 require。