# 管理华为云Astro轻应用高级页面
#### 为高级页面设置水印
高级页面创建后，支持为高级页面添加水印。水印可以用于标识页面的所有者、状态或其他相关信息，建议不要过多的设置水印，可能会影响页面的美观。
1. 参考[登录华为云Astro轻应用应用设计器](https://support.huaweicloud.com/usermanual-astrozero/astrozero_05_9004.html)中操作，登录应用设计器。
2. 在左侧导航栏中，选择"界面"。
3. 将鼠标放在对应的高级页面上，单击![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001934713532.png)，选择"设置"。
4. 在"水印"页签，参照[表1]设置参数，单击"保存"。
   
   图1水印设置   
   ![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000002134337789.png "点击放大")
   图2设置后效果   
   ![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001936098981.png "点击放大")
    表1新增水印参数说明 
   | 参数     | 说明                                     |
   |:---|:---|
   | 启用水印   | 是否给该页面启用水印。                            |
   | 重复渲染   | 当需要设置满页面水印时，开启该项。                      |
   | 水印内容   | 设置水印文本内容。                              |
   | 水印长度   | 水印矩形框的长度。                              |
   | 水印宽度   | 水印矩形框的宽度。                              |
   | 水平起始位置 | 当关闭"重复渲染"时，才可设置，表示单个水印在页面的水平起始位置。      |
   | 垂直起始位置 | 当关闭"重复渲染"时，才可设置，表示单个水印在页面的垂直起始位置。      |
   | 字体颜色   | 水印字体的颜色。                               |
   | 字体大小   | 水印字体的大小。                               |
   | 旋转角度   | 水印的旋转角度，取值范围-180\~180，即逆时针或者顺时针旋转180度。 |
   | 透明度    | 水印的透明度设置。                              |
      
   
   
 
#### 设置高级页面基本信息
高级页面创建后，支持设置高级页面的基本信息，如名称、路径名称、标题等。
1. 参考[登录华为云Astro轻应用应用设计器](https://support.huaweicloud.com/usermanual-astrozero/astrozero_05_9004.html)中操作，进入应用设计器。
2. 在应用设计器的左侧导航栏中，选择"界面"。
3. 将鼠标放在对应的高级页面上，单击![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001913634754.png)，选择"设置"。
4. 在"基本信息"页签中，修改所需参数，单击"保存"。 
   表2设置高级页面基本信息参数说明 
   | 参数          | 说明                                                                                                                                                                                                                                                                                                                           |
   |:---|:---|
   | 名称          | 高级页面的名称，即创建高级页面时设置的名称，可根据实际需求进行修改。命名要求如下： - 长度范围为1\~100个字符。  - 必须以字母开头，由字母、数字或单下划线组成，且单下划线不能连续。   |
   | 路径名称        | 路径名称和高级页面名称保持一致，可根据实际需求进行修改。命名要求如下： - 长度范围为1\~100个字符。  - 必须以字母开头，由字母，数字或单下划线组成。                    |
   | 标题          | 高级页面的标题，即创建高级页面时设置的标签，可根据实际需求进行修改。                                                                                                                                                                                                                                                                                           |
   | 描述          | 根据实际需求，在输入框中输入高级页面的描述信息。                                                                                                                                                                                                                                                                                                     |
   | 关键字         | 用于和接口进行交互。                                                                                                                                                                                                                                                                                                                   |
   | 拉伸          | 勾选后，高级页面宽度会扩展至100%，以适应整个浏览器或设备的可视宽度，同时组件内容的宽度也会根据容器的宽度进行调整。默认为不勾选。                                                                                                                                                                                                                                                           |
   | 缩放和拖移       | 发布后的高级页面中，组件是否支持用户缩放或拖动。 默认为不勾选。                                                                                                                                                                                                                                                         |
   | 页面是否可定制修改   | 在扩展应用中，是否支持从依赖的应用中，将该高级页面导入。 默认为不勾选。                                                                                                                                                                                                                                                    |
   | 浏览器缓存有效期（天） | 间隔多少天刷新一次浏览器缓存。                                                                                                                                                                                                                                                                                                              |
      
   
   
 
#### 将高级页面发布为模板
高级页面开发完成后，支持将该页面发布为模板。高级页面发布为模板后，该开发者用户、注册华为云Astro轻应用的华为账号、华为账号下其他华为云Astro轻应用开发者可直接使用该页面模板来创建高级页面。
1. 参考[登录华为云Astro轻应用应用设计器](https://support.huaweicloud.com/usermanual-astrozero/astrozero_05_9004.html)中操作，进入应用设计器。
2. 在应用设计器的左侧导航栏中，选择"界面"。
3. 单击对应的高级页面，进入高级页面的设计界面。
4. 单击![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001945882293.png)，进入发布页面模板界面。
5. 输入模板的名称和描述。 
   图3发布页面模板   
   ![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001913871738.png "点击放大")
   表3发布页面模板参数说明 
   | 参数   | 说明                                                                             |
   |:---|:---|
   | 模板名称 | 高级页面发布为模板时，模板的名称。 命名要求：由字母、数字、下划线和中划线组成。 |
   | 模板描述 | 请根据实际需求，输入模板的描述信息。 取值范围：1\~255个字符。         |
      
   
   
6. 设置完成后，单击"发布"，即可将高级页面发布为模板。 
   高级页面发布为模板后，可以基于模板创建新的页面，也可以管理页面模板。
   - 基于高级页面模板，创建新的高级页面。
     在添加高级页面时，可选择基于已创建的模板创建新的高级页面。
     图4选中模板创建高级页面   
     ![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001914088736.png "点击放大") 
   
   - 预览或删除高级页面模板。 在华为云Astro轻应用环境配置的"维护 \> 全局元素 \> 页面资产管理 \> 页面模板"中，可预览或删除模板，详情请参见[管理页面模板](https://support.huaweicloud.com/usermanual-astrozero/astrozero_06_2056.html)。
     
    
   
   
 
#### 克隆高级页面
页面创建完成后，支持将高级页面克隆到当前应用中。例如，应用A中存在两个或多个功能类似的高级页面，此时可基于已创建的高级页面克隆出一个新页面，基于克隆后的页面进行修改，减少重复创建的操作。
1. 参考[登录华为云Astro轻应用应用设计器](https://support.huaweicloud.com/usermanual-astrozero/astrozero_05_9004.html)中操作，进入应用设计器。
2. 在应用设计器的左侧导航栏中，选择"界面"。
3. 将鼠标放在对应的高级页面上，单击![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001945879113.png)，选择"克隆"。
4. 输入高级页面的名称和唯一标识，单击"确认"。 
   克隆成功后，自动进行克隆后的高级页面。
   
   
 
#### 删除高级页面
应用中的某个高级页面不再使用时，支持将其从应用中删除，避免占用账号的资源配额。
1. 参考[登录华为云Astro轻应用应用设计器](https://support.huaweicloud.com/usermanual-astrozero/astrozero_05_9004.html)中操作，进入应用设计器。
2. 在应用设计器的左侧导航栏中，选择"界面"。
3. 将鼠标放在对应的高级页面上，单击![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001945881713.png)，选择"删除"。
4. 在弹出的确认框中，单击"确认"，即可删除高级页面。
 
#### 管理页面级数据源、全局状态
页面组件之间，可以通过配置事件和动作进行信息交互。当页面组件较多，且需要进行信息交互时，频繁的给每个组件去定义事件或动作就比较繁琐了。此时，可以通过定义全局状态，来实现页面级所有组件中数据信息的更新。
华为云Astro轻应用低代码平台高级页面支持设置全局状态，通过页面级内存方式共享数据，即采用集中式存储管理页面所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。简单的理解就是全局状态，可理解为页面中所有组件的共享状态，不管组件在页面的哪个位置或层级，任何组件都能获取状态或触发状态改变的动作。全局状态相当于全局变量，属性是私有的，需要在组件的js文件中，使用预置的"this.$mstore.dispatch"方法，来修改状态数据。
全局状态使用场景：当页面组件构成比较简单，组件间不需要频繁的进行信息交互时，不需要设置全局状态。反之，则建议使用全局状态，通过设置并使用全局状态，可以帮助您管理页面所有组件的共享状态。
1. 参考[登录华为云Astro轻应用应用设计器](https://support.huaweicloud.com/usermanual-astrozero/astrozero_05_9004.html)中操作，登录应用设计器。
2. 在左侧导航栏中，选择"界面"。
3. 在高级页面中，单击对应的页面，进入高级页面开发界面。
4. 在页面右上角，单击![](https://support.huaweicloud.com/usermanual-astrozero/zh-cn_image_0000001913782906.png)，定义全局状态。
   
   定义全局状态使用JavaScript编程语言，不支持TypeScript。全局状态结构固定以MStore命名，每个页面仅包含一个全局状态实例，方便在组件调试的过程中，轻易地获取整个当前页面状态的快照。全局状态的结构定义由以下三部分组成：
   - state：定义页面所有组件的初始状态数据，即页面中所有组件共享状态的初始数据源。
   
   - mutations：状态变更的唯一方法是提交mutation。mutation以声明的方式，将state变化映射到视图，每次state的变更都需要定义一个mutation。mutation使用对象风格的提交方式，整个对象都作为载荷（payload）传给mutation函数，mutation都是同步事务。
   
   - actions：通过actions执行状态数据变更，用于衔接state和mutation。Action可以包含任意异步操作，通常用于绑定状态和组件，可以调用服务。
   
   
   
   
5. 在页面的组件js文件中，使用预置的"this.$mstore.dispatch（）"方法，修改状态数据。