4 迁移页面

4.1 新建页面

如上所述，小程序 app.json 中 pages 每个字段，对应router.config.json中每条路由项，对应cml项目的每个页面

cml init page
输入 index1
cml init page 
输入 index2 
...

利用脚手架命令，在src/pages中生成对应的页面

4.2 迁移页面配置

假设小程序原有页面 index1.json 配置如下

{
  "usingComponents": {
    "my-component1": "/components/comp1",
    "my-component2": "/components/comp2",
    "my-component3": "/components/comp3",
  },
  "navigationBarTitleText": "index",
  "backgroundTextStyle": "dark",
  "backgroundColor": "#E2E2E2"
}

修改src/pages/index1.cml 页面配置，如下：

<script cml-type="json">
{
  "base": {
    "usingComponents": {
         "my-component1": "/components/comp1",
        "my-component2": "/components/comp2",
        "my-component3": "/components/comp3",
    }
  },
  "wx": {
    "navigationBarTitleText": "index",
    "backgroundTextStyle": "dark",
    "backgroundColor": "#E2E2E2"
  }
}
</script>

其中：

• base 代表各个小程序页面的共有配置

• wx 代表微信小程序端特有的配置

4.3 迁移页面 ———— 生命周期映射

总结

1 小程序页面的迁移都要通过 cml init page去初始化这个页面

2 初始化的页面要在src/router.config.json配置对应的path字段